.fsBody .DNPCm {
	padding: 1.25rem;
	background-color: var(--color-tci-purple-mist);
}

.fsForm {
	padding: 0 !important;
	margin: 0 !important;
	background-color: #0000 !important;

	& input:not([type="radio"], [type="checkbox"]),
	& select,
	& textarea {
		display: flex;
		align-items: center;
		width: 100%;
		padding: 0.75rem 1rem;
		color: var(--color-tci-neutral-slate);
		appearance: none;
		background-color: var(--color-tci-neutral-warm);
		border: 1px solid var(--color-tci-purple-ink);
		border-radius: 0 !important;
	}
}

.fsForm input[type="checkbox"] {
	appearance: auto !important;
	accent-color: var(--color-tci-purple-primary);

	&::before {
		content: none !important;
	}
}

.fsSection:not(:last-child) {
	padding-bottom: 2rem;
}

.fsSectionHeader {
	padding: 0 0 0.5rem !important;
	margin-block: 0 !important;
	background-color: #0000 !important;

	& h2 {
		color: var(--color-tci-purple-primary);
	}
}

.fsLabel,
.dMpupb {
	padding-block: 0.5rem;
	margin-bottom: 0.25rem !important;
	font-family: var(--font-display);
	font-size: var(--text-h6) !important;
	font-weight: 700;

	&,
	& .fsRequiredMarker {
		color: var(--color-tci-purple-ink) !important;
	}
}

.fsFieldCell p span {
	font-size: var(--text-body) !important;
	color: var(--color-tci-purple-ink) !important;

	& a {
		font-weight: 700;
		color: var(--color-tci-purple-primary) !important;
		text-decoration: underline;
	}
}

.fsSubmit {
	padding: 0 !important;
	margin: 0 !important;

	& button {
		margin: 0 !important;
		background-color: var(--color-tci-purple-iris);
		border-radius: 0;

		&:hover {
			background-color: var(--color-tci-purple-primary);
		}
	}
}

@scope (.signup) {
	.dSRjBT {
		display: none;
	}

	:is(.fsBody, .fsBody .DNPCm) {
		padding: 0;
		background: none;
	}

	.fsForm {
		display: flex;
		flex-wrap: wrap;
		column-gap: 0.5rem;
		align-items: start;
		max-width: 36rem;

		/* form-level error banner: give it its own row instead of eating space beside the input */
		> [aria-live] {
			flex-basis: 100%;
		}
	}

	.fsPage {
		flex: 1;
		min-width: 0;
	}

	span.fsFieldCell {
		display: none;
	}

	label.fsFieldCell {
		margin-bottom: 0;
	}

	.fsLabel {
		display: none;
	}

	.fsSupporting {
		color: var(--color-tci-neutral-warm);
	}
}

@font-face {
	font-family: "Clash Display";
	font-weight: 700;
	src: url("./fonts/ClashDisplay-Bold.otf") format("opentype");
	font-display: swap;
}

:root {
	--container: max(2rem, calc((100% - 90rem) / 2));
	--header-height: 144px;
}

@layer base {
	body {
		line-height: var(--text-body--line-height);
		color: var(--color-tci-purple-ink);
		scrollbar-gutter: stable;
	}

	p {
		font-size: var(--text-body-lg);

		a {
			text-decoration: underline;
		}
	}

	:where(h1, h2, h3, h4, h5, h6) :is(i, em) {
		margin-right: 0.5rem;
	}

	:where(h1, h2, h3, h4, h5, h6, .text-display, .text-display-sm) {
		font-family: var(--font-display);
		font-weight: 700;
	}

	button {
		cursor: pointer;
		transition:
			color 0.15s,
			background-color 0.15s;
	}

	a {
		transition: color 0.15s;

		&:not(.btn):hover {
			text-decoration: underline;
		}
	}

	input:not([type="radio"], [type="checkbox"]),
	select,
	textarea {
		display: flex;
		align-items: center;
		width: 100%;
		padding: 0.75rem 1rem;
		color: var(--color-tci-neutral-slate);
		appearance: none;
		background-color: var(--color-tci-neutral-warm);
		border: 1px solid var(--color-tci-purple-ink);
	}

	select {
		background:
			url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%3e%3cpath%20d='M8%2010.2667L4%206.26667L4.93333%205.33333L8%208.4L11.0667%205.33333L12%206.26667L8%2010.2667Z'%20fill='currentColor'%20/%3e%3c/svg%3e")
				no-repeat right 1rem center,
			var(--color-tci-neutral-warm);
	}

	textarea {
		font-family: inherit;
		resize: vertical;
	}
}

@layer utilities {
	.max-w-container {
		padding-inline: var(--container);
	}

	.text-eyebrow {
		text-transform: uppercase;
	}

	.grid-auto-fill {
		grid-template-columns: repeat(auto-fill, minmax(min(18rem, 100%), 1fr));
	}
}

@layer components {
	.badge {
		display: inline-flex;
		padding: 0.25rem 0.75rem;
		color: var(--color-tci-neutral-warm);
		background-color: var(--color-tci-purple-primary);
	}

	.no-hero {
		padding-top: calc(var(--header-height) + 6rem);

		@media (width<64rem) {
			padding-top: calc(var(--header-height) + 2rem);
		}
	}

	.btn {
		display: flex;
		gap: 1rem;
		align-items: center;
		padding: 1rem 1.25rem;
		font-weight: 700;
		line-height: var(--text-navigation--line-height);
		color: var(--color-tci-neutral-warm);
		background-color: var(--color-tci-purple-primary);

		&:hover {
			color: var(--color-tci-neutral-ink);
			background-color: var(--color-tci-purple-iris);
		}

		&.btn-invert {
			color: var(--color-tci-neutral-ink);
			background-color: var(--color-tci-purple-iris);

			&:hover {
				background-color: var(--color-tci-purple-lavender);
			}
		}

		&.btn-sm {
			padding: 0.75rem 1rem;
			font-size: 0.875rem;
		}

		&.btn-inactive {
			color: var(--color-tci-neutral-slate);
			background-color: var(--color-tci-neutral-warm);
		}
	}

	.controls .swiper-button-disabled {
		cursor: default;
		opacity: 40%;
	}

	.btn-link {
		position: relative;
		display: inline-flex;
		gap: 0.5rem;
		align-items: center;
		width: fit-content;
		max-width: 100%;
		padding-right: 1.5rem;
		font-weight: 700;
		line-height: var(--text-navigation--line-height);
		letter-spacing: 0.2px;

		&::after {
			position: absolute;
			top: 50%;
			right: 0;
			content: "→";
			transform: translateY(-50%);
			transition: transform 0.2s;
		}

		&:hover::after {
			transform: translate(0.25rem, -50%);
		}
	}

	.form-label {
		padding-block: 0.5rem;
		font-family: var(--font-display);
		font-size: var(--text-h6);
		font-weight: 700;
		color: var(--color-tci-purple-ink);
	}

	.hint {
		font-size: 0.875rem;
		color: var(--color-tci-neutral-slate);
	}

	.accordion {
		& .toggle-icon .bar {
			transform: rotate(90deg);
			transition: transform 0.3s;
		}

		&[open] .toggle-icon .bar {
			transform: rotate(0);
		}

		&[open]::details-content {
			padding-bottom: 2rem;
		}
	}

	.framed-photo {
		inset: 18.75%;
		width: 62.5%;
		height: 62.5%;
	}

	.cta-lede p {
		max-width: 32rem;
		font-weight: 700;
		color: var(--color-tci-neutral-warm);
		opacity: 85%;
	}
}

@scope (#hero) {
	.inner {
		padding-top: calc(var(--header-height) + 36px);
	}

	.content p {
		font-weight: 700;
		color: var(--color-tci-neutral-warm);
	}
}

:where(.prose, .rich-text) blockquote,
.pull-quote {
	--quote-mark-height: 5rem;
	--quote-font-size: var(--text-h3);
	--quote-line-height: var(--text-h3--line-height);
	--quote-footer-font-size: 1.25rem;
	--quote-padding: 3.75rem;

	display: flex;
	flex-direction: column;
	gap: 2.5rem;
	align-items: start;
	justify-content: center;
	padding: var(--quote-padding);
	overflow: hidden;
	color: var(--color-tci-teal-aquamarine);
	background-color: var(--color-tci-teal-mineral);

	@media (width<48rem) {
		padding: 2rem;
	}

	& svg {
		width: auto;
		height: var(--quote-mark-height);
		color: var(--color-tci-teal-deep-mineral);
	}

	& p {
		font-family: var(--font-display);
		font-size: var(--quote-font-size);
		font-weight: 700;
		line-height: var(--quote-line-height);
		color: inherit;
	}

	& footer {
		font-size: var(--quote-footer-font-size);
		font-weight: 700;
		line-height: var(--text-body--line-height);
	}
}

:where(.prose) > div > div > blockquote,
:where(.rich-text) blockquote,
.pull-quote-sm {
	--quote-mark-height: 3.75rem;
	--quote-font-size: var(--text-h4);
	--quote-line-height: var(--text-h4--line-height);
	--quote-footer-font-size: var(--text-body-lg);
	--quote-padding: 2rem;
}

@scope (.prose) to (#breadcrumbs) {
	.inner {
		max-width: 72rem;
		margin-inline: auto;

		> :not(:last-child) {
			margin-bottom: 2.5rem;
		}
	}

	h2 {
		font-size: var(--text-h3);
		line-height: var(--text-h3--line-height);
		color: var(--color-tci-purple-violet);
	}

	h3 {
		font-size: var(--text-h4);
		line-height: var(--text-h4--line-height);
		color: var(--color-tci-purple-violet);
	}

	ul,
	ol {
		display: flex;
		flex-direction: column;
		gap: 0.75rem;
		padding-left: 1.25rem;
	}

	ul {
		list-style: disc;
	}

	ol {
		list-style: decimal;
	}

	li {
		font-size: var(--text-body-lg);
		line-height: var(--text-body-lg--line-height);

		&::marker {
			color: var(--color-tci-purple-lavender);
		}
	}

	li ul {
		list-style: circle;
	}

	li ol {
		list-style: lower-alpha;
	}

	li :is(ul, ol) {
		gap: 0.25rem;
		margin-block-start: 0.5rem;
	}

	a {
		text-decoration: underline;
	}

	.inner > div:not(:has(> :only-child)) {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 3.25rem;
		align-items: start;
		max-width: none;
		margin-inline: 0;

		@media (width<64rem) {
			grid-template-columns: minmax(0, 1fr);
		}
	}

	figure {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 1.25rem;
		overflow: hidden;
	}

	figcaption {
		font-size: 1rem;
		font-weight: 700;
		color: var(--color-tci-purple-violet);
		letter-spacing: 0.2px;
	}

	section {
		display: flex;
		flex-direction: column;
		gap: 1.5rem;
	}

	section :is(h2, h3) {
		margin-bottom: -0.875rem;
	}

	.inner > p:first-child {
		font-size: 1.25rem;
		font-weight: 700;
	}

	.inner > img {
		width: 100%;
		height: 41.25rem;
		object-fit: cover;
		background-color: var(--color-tci-purple-primary);

		@media (width<48rem) {
			height: 20rem;
		}
	}

	td {
		vertical-align: top;

		&:empty {
			width: 1rem;
		}

		&:has(video) {
			min-width: 32rem;
		}
	}

	img {
		margin: 1.25rem auto;
		max-width: min(100%, 48rem);
	}

	/* iframe */
	.inner > div:has(> iframe:only-child) {
		width: 100%;
	}

	iframe {
		width: 100%;
		height: auto;
		aspect-ratio: 16 / 9;
	}
}

@scope (.rich-text) to (#breadcrumbs) {
	a:where(:not(.btn, .btn-link)) {
		font-weight: 700;
		color: var(--color-tci-purple-primary);
		text-decoration: underline;
	}
}

@scope (#site-footer) {
	.intro p {
		color: var(--color-tci-neutral-warm);
	}

	.legal {
		font: 400 1rem / 1.5 var(--font-sans);
		color: var(--color-tci-neutral-warm);
	}
}

@scope (.mega-menu) {
	:scope {
		line-height: var(--text-body--line-height);
	}

	.inner {
		padding-inline: var(--container);

		@media (width >= 48rem) and (width < 80rem) {
			flex-direction: row;
		}
	}

	.column:not(:last-child) {
		width: 100%;
		padding-bottom: 1.5rem;
		border-bottom: 1px solid var(--color-tci-purple-iris);
	}

	@media (width>=80rem) {
		:scope {
			padding-top: 3rem;
		}

		.inner {
			grid-template-columns: 1fr 1px 1fr 1px 1fr;
		}

		.column:not(:last-child) {
			padding-bottom: 0;
			border-bottom: 0;
		}
	}

	a:hover {
		text-decoration: none;
	}

	.feature {
		display: flex;
		flex-direction: column;
		gap: 0.25rem;
		padding: 0.5rem;
	}
}

@scope (#site-header) {
	:scope {
		--pct: var(--header-scroll, 0%);
		--logo-color: color-mix(
			in oklch,
			var(--color-tci-purple-primary) var(--pct),
			var(--color-tci-neutral-warm)
		);
		--header-fg: color-mix(
			in oklch,
			var(--color-tci-purple-ink) var(--pct),
			var(--color-tci-neutral-warm)
		);

		&:has(#nav-toggle[aria-expanded="true"], #primary-nav [open]) {
			--logo-color: var(--color-tci-purple-primary);
			--header-fg: var(--color-tci-purple-ink);
		}
	}

	.color-swap {
		color: var(--header-fg);

		& a {
			transition: none;
		}
	}

	.color-swap-logo {
		color: var(--logo-color);
	}

	#primary-nav {
		background-color: color-mix(
			in oklch,
			oklch(100% 0 0deg / var(--pct)) var(--pct),
			var(--header-bg-initial, transparent)
		);

		&:not(:has([aria-expanded="true"]))[data-variant="purple"] {
			--header-bg-initial: var(--color-tci-purple-primary);
		}

		& li {
			transition: border-color 0.15s;

			&:hover,
			&:has([open]) {
				border-bottom-color: var(--color-tci-purple-lavender);
			}
		}
	}

	#mobile-nav {
		height: calc(100svh - 3rem);
	}

	#nav-toggle .close-icon,
	#nav-toggle[aria-expanded="true"] .menu-icon {
		display: none;
	}

	#nav-toggle[aria-expanded="true"] .close-icon {
		display: block;
	}
}

@scope (.card) {
	p {
		font-size: var(--text-body);
	}

	ul {
		list-style: disc;
		padding-left: 1.5rem;
	}
}

@scope (.featured-card) {
	p {
		font-size: var(--text-body);
	}

	.head p {
		font-weight: 700;
	}

	ol {
		padding-left: 1.5rem;
		list-style: decimal;
	}
}

@scope (#thank-you) {
	.content :is(h2, h3) {
		font-size: var(--text-h5);
		color: var(--color-tci-purple-violet);
	}

	.resources {
		@media (width>=64rem) {
			padding-left: 4rem;
			border-left: 1px solid var(--color-tci-neutral-stone);
		}
	}

	:is(.content, .resources) ul {
		display: flex;
		flex-direction: column;
		gap: 1rem;
		padding-left: 1rem;
		color: var(--color-tci-purple-primary);
		list-style: outside;
	}

	:is(.content, .resources) p:not(:last-child) {
		margin-bottom: 1rem;
	}
}

@scope (#faqs) {
	.faq[open] {
		border-bottom: 1px solid var(--color-tci-purple-iris);
	}

	.faq[open] summary {
		color: var(--color-tci-purple-mist);
		background-color: var(--color-tci-purple-primary);
	}
}

@scope (.teaser-banner) {
	:scope {
		& h3 {
			color: var(--color-tci-purple-violet);
		}

		& p,
		& li {
			color: var(--color-tci-purple-ink);
		}

		& ul,
		& ol {
			display: flex;
			flex-direction: column;
			gap: 0.75rem;
			padding-left: 1rem;
		}

		& ul {
			list-style: outside;
		}

		& ol {
			list-style: decimal;
		}

		&.dark {
			& h3 {
				color: var(--color-tci-purple-mist);
			}

			& p,
			& li {
				color: var(--color-tci-neutral-warm);
			}

			& a:not(.btn) {
				color: inherit;
			}
		}
	}
}

@scope (#coach-resources) {
	hgroup p {
		font-size: var(--text-body-lg);
		color: var(--color-tci-neutral-warm);
	}

	.resources {
		& li {
			@media (width>=64rem) {
				flex: calc(33% - 1.5rem);
				max-width: 33%;
			}
		}

		& p {
			color: var(--color-tci-neutral-warm);
		}
	}
}

@scope (#perks) {
	.perks p {
		font-size: var(--text-body);
		color: var(--color-tci-neutral-slate);
	}
}

@scope (.testimonial-card) {
	:scope {
		border-top: 6px solid var(--accent);

		@media (width>=64rem) {
			box-shadow:
				0 180px 50px #0000,
				0 115px 46px #00000005,
				0 65px 39px #0000000d,
				0 29px 29px #00000017,
				0 7px 16px #0000001a;
		}
	}

	&.accent-citron {
		--accent: var(--color-tci-citron-signal);
	}

	&.accent-raspberry {
		--accent: var(--color-tci-mulberry-raspberry);
	}

	&.accent-teal {
		--accent: var(--color-tci-teal-atmospheric);
	}

	&.accent-iris {
		--accent: var(--color-tci-purple-iris);
	}

	&.accent-purple {
		--accent: var(--color-tci-purple-primary);
	}

	.quote-mark {
		color: var(--accent);
	}

	blockquote {
		font: 700 var(--text-quote) / var(--text-quote--line-height) var(--font-display);
		color: var(--color-tci-neutral-paper);
		transition: color 0.3s;
	}

	.location {
		color: var(--color-tci-purple-violet);
	}

	.active & blockquote {
		color: var(--accent);
	}
}

@scope (.testimonial-cta) {
	:scope .testimonial-stack {
		width: 100%;
	}

	:scope .stack-item {
		height: auto;
	}

	@media (width>=64rem) {
		:scope .testimonial-stack {
			overflow: visible;
		}

		:scope .stack-track {
			display: grid;
			grid-template-areas: "stack";
			place-items: start center;
			width: 100%;
			height: auto;
			padding-top: 6rem;
		}

		:scope .stack-item {
			grid-area: stack;
			width: auto;
			transform: translateX(var(--tx, 0)) translateY(calc(var(--ad, 0) * -2rem))
				rotate(calc(var(--s, 0) * 9deg));
			transform-origin: center top;
			transition:
				transform 500ms cubic-bezier(0.22, 1, 0.36, 1),
				opacity 300ms;
		}

		:scope .stack-item:not(.active) {
			cursor: pointer;
		}
	}

	@media (width<64rem) {
		:scope .stack-track {
			align-items: center;
		}

		:scope .stack-item {
			display: flex;
			justify-content: center;
		}
	}
}

@scope (.social-media) {
	.left p {
		color: var(--color-tci-purple-violet);
	}

	.panel {
		top: 23.8%;
		left: 18.9%;
		width: 62.25%;
		height: 52.4%;
	}

	.icon {
		width: 20%;
		transition: scale 0.15s;

		&:hover {
			scale: 1.15;
		}
	}

	.icon svg path {
		fill: currentcolor;
	}
}

@scope (.contact-section) {
	.content p {
		font-weight: 700;
		color: var(--color-tci-neutral-slate);
	}

	.aside p {
		font-size: var(--text-body);
		color: var(--color-tci-neutral-slate);
	}

	.right:not(.embedded) p {
		font-size: var(--text-body);
		color: var(--color-tci-purple-ink);
	}
}

@scope (#professional-development) {
	:scope {
		background-color: var(--color-tci-purple-mist);

		&.dark {
			background-color: var(--color-tci-purple-primary);
		}
	}

	header {
		& .text-eyebrow {
			color: var(--color-tci-purple-primary);
		}

		& h2 {
			color: var(--color-tci-purple-violet);
		}

		& p {
			max-width: 65ch;
			font-weight: 700;
			color: var(--color-tci-purple-ink);
		}

		.dark & {
			& .text-eyebrow {
				color: var(--color-tci-purple-mist);
			}

			& h2 {
				color: var(--color-tci-purple-lavender);
			}

			& p {
				color: var(--color-tci-neutral-warm);
			}
		}
	}
}

@scope (.event-listing) {
	.event-card p {
		max-width: 56rem;
		margin-block: 1rem;
		font-size: var(--text-body);
	}
}

@scope (#featured-courses) {
	header p {
		font-size: var(--text-body);
	}
}

#story,
#philosophy {
	& > * {
		flex: 1;
	}
}

@scope (#story) {
	p:not(:last-child) {
		margin-bottom: 2rem;
	}
}

#story + .banner h3 {
	max-width: 42rem;
}

@scope (#latest) {
	hgroup p {
		font-size: var(--text-body);
		font-weight: 700;
	}
}

#elements-of-hqim .elements p {
	font-size: var(--text-body);
	color: var(--color-tci-purple-ink);
}

@scope (.review-row) {
	.content p:not(:where(blockquote p)),
	.content li {
		font-size: var(--text-body);
		color: var(--color-tci-purple-ink);
	}

	.content ul {
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
		padding-left: 1rem;
		list-style: outside;
	}
}

@scope (.section-header) {
	p {
		font-size: var(--text-body);
		color: var(--color-tci-neutral-slate);
	}
}

@scope (#state-approvals) {
	.card {
		background-color: var(--color-tci-neutral-warm);
	}

	.card > div:last-child {
		padding: 1.5rem;
	}
}

@scope (.sample-listing) {
	.card p {
		font-size: var(--text-body-lg);
	}
}

@scope (#state-select) {
	:scope {
		cursor: pointer;
		background-color: var(--color-tci-purple-mist);
		border: 1px solid var(--color-tci-neutral-warm);
	}

	select {
		cursor: pointer;
		opacity: 0%;
	}
}

@scope (#request-sample) {
	.samples li {
		font-size: var(--text-body-lg);
	}

	.samples p {
		font-weight: 700;
	}
}

@scope (#program-timeline) {
	.rail {
		top: calc(var(--header-height) + 10rem);
	}

	.track {
		bottom: 5rem;
		background: linear-gradient(
			to bottom,
			transparent,
			var(--color-tci-purple-lavender) 0%,
			var(--color-tci-purple-lavender) 99%,
			transparent
		);
		mask-image: linear-gradient(#0000 0%, #000 10% 90%, #0000 100%);
	}

	.panel {
		color: var(--timeline-text, var(--color-tci-neutral-warm));

		.entry:nth-child(5n + 1) & {
			--timeline-bg: var(--color-tci-purple-lavender);
			--timeline-text: var(--color-tci-purple-ink);
			--timeline-heading: var(--color-tci-purple-ink);
			--timeline-accent: var(--color-tci-purple-violet);
		}

		.entry:nth-child(5n + 2) & {
			--timeline-bg: var(--color-tci-purple-primary);
			--timeline-heading: var(--color-tci-purple-lavender);
			--timeline-accent: var(--color-tci-purple-mist);
		}

		.entry:nth-child(5n + 3) & {
			--timeline-bg: var(--color-tci-teal-mineral);
			--timeline-heading: var(--color-tci-teal-atmospheric);
			--timeline-accent: var(--color-tci-teal-aquamarine);
		}

		.entry:nth-child(5n + 4) & {
			--timeline-bg: var(--color-tci-mulberry-aubergine);
			--timeline-heading: var(--color-tci-mulberry-raspberry);
			--timeline-accent: var(--color-tci-mulberry-orchid);
		}

		.entry:nth-child(5n) & {
			--timeline-bg: var(--color-tci-citron-moss);
			--timeline-heading: var(--color-tci-citron-signal);
			--timeline-accent: var(--color-tci-citron-soft);
		}
	}
}

#support .left {
	top: calc(var(--header-height) + 2rem);
}

@scope (.card-list) {
	.featured-card:not(:first-child) :is(h3, p, ol) {
		color: var(--color-tci-neutral-warm);
	}

	.featured-card:first-child {
		background-color: var(--color-tci-purple-iris);
	}

	.featured-card:nth-child(2) {
		background-color: var(--color-tci-purple-primary);
	}

	.featured-card:last-child {
		background-color: var(--color-tci-purple-violet);
	}
}

@scope (.feature-grid) {
	.items {
		--color: var(--color-tci-purple-violet);

		background-color: var(--color-tci-purple-mist);

		&.dark {
			--color: var(--color-tci-neutral-warm);

			background-color: var(--color-tci-purple-violet);
		}
	}

	.item {
		flex: calc(33.333% - 2rem);

		@media (width<64rem) {
			flex-basis: 100%;
		}

		& h3,
		& p {
			color: var(--color);
		}

		& p {
			font-size: var(--text-body);
		}
	}
}

@scope (.accented-banner) {
	:scope {
		&.teal {
			--accent: var(--color-tci-teal-atmospheric);
			--accent-contrast: var(--color-tci-teal-deep-mineral);
			--accent-tertiary: var(--color-tci-teal-aquamarine);
		}

		&.mulberry {
			--accent: var(--color-tci-mulberry-raspberry);
			--accent-contrast: var(--color-tci-mulberry-aubergine);
			--accent-tertiary: var(--color-tci-mulberry-orchid);
		}

		&.citron {
			--accent: var(--color-tci-citron-signal);
			--accent-contrast: var(--color-tci-citron-moss);
			--accent-tertiary: var(--color-tci-citron-soft);
		}

		& h2 {
			color: var(--accent);
		}

		& p,
		& ul {
			color: var(--color-tci-neutral-warm);
		}

		& ul {
			padding-left: 1.5rem;
			font-size: var(--text-body-lg);
			list-style: outside;
		}

		& .cta:not(.btn-link) {
			color: var(--accent-contrast);
			background-color: var(--accent);

			&:hover {
				color: var(--accent);
				background-color: var(--accent-contrast);
			}
		}

		& .cta.btn-link {
			color: var(--accent-tertiary);
		}
	}
}

@scope (#print-materials) {
	.toggle button[aria-selected="true"] {
		color: var(--color-tci-neutral-warm);
		background-color: var(--color-tci-purple-primary);
	}

	article {
		gap: 1.25rem;
	}

	article p {
		flex: 1;
	}
}

.announcement p {
	color: var(--color-tci-purple-ink);
}

#our-method :is(.intro, .steps) p {
	color: var(--color-tci-neutral-warm);
}

@scope (#hero) {
	.prose h2 {
		margin-bottom: 0.25rem;
	}

	.aside h2,
	.aside p {
		color: var(--color-tci-purple-ink);
	}
}

#request-a-quote .featured-card .head + p {
	font-weight: 700;

	& a {
		text-decoration: underline;
	}
}

@scope (.tab-list) {
	:scope {
		@media (width<64rem) {
			top: var(--header-height);
			background-color: oklch(100% 0 0deg/85%);
		}

		@media (width>=64rem) {
			top: calc(var(--header-height) + 1.5rem);
		}
	}

	ul {
		scrollbar-width: thin;
		-webkit-overflow-scrolling: touch;
	}

	.tab-link {
		color: var(--color-tci-purple-ink);
		cursor: pointer;

		&:hover {
			color: var(--color-tci-purple-primary);
			text-decoration: none;
		}

		&.is-active,
		&[aria-selected="true"] {
			color: var(--color-tci-purple-primary);
			background-color: var(--color-tci-purple-mist);
		}
	}
}

@scope (.tab-section) {
	hgroup p {
		font-size: var(--text-body);
	}

	.tab-content {
		scroll-margin-top: calc(var(--header-height) + 5rem);

		@media (width>=64rem) {
			scroll-margin-top: calc(var(--header-height) + 1.5rem);
		}
	}
}

@scope (.material) {
	.details p {
		color: var(--color-tci-purple-ink);
	}
}

@scope (.spec-columns) {
	h4 {
		margin-bottom: 0.25rem;
		font-size: var(--text-h6);
		color: var(--color-tci-purple-violet);
	}

	p {
		font-size: var(--text-body);
	}

	ul {
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
		padding-left: 1.5rem;
		font-size: var(--text-body);
		list-style: outside;
	}

	li::marker {
		color: var(--color-tci-purple-iris);
	}

	strong {
		color: var(--color-tci-purple-violet);
	}
}

@scope (.role) {
	:is(.step, .link) p {
		font-size: var(--text-body);

		& a {
			text-decoration: underline;
		}
	}

	.link > a {
		&:hover {
			text-decoration: underline;
		}
	}
}

@scope (#active-learning) {
	p {
		color: var(--color-tci-neutral-warm);
	}

	p:first-child {
		font-family: var(--font-display);
		font-size: var(--text-h4);
		font-weight: 700;
		line-height: var(--text-h4--line-height);
	}
}

@scope (#our-approach) {
	p,
	li {
		color: var(--color-tci-neutral-warm);
	}

	ul {
		padding-left: 1rem;
		list-style: outside;
	}

	li {
		font-size: var(--text-body-lg);
		line-height: var(--text-body-lg--line-height);
	}
}

#a-tci-lesson li p {
	font-size: var(--text-body);
	color: var(--color-tci-purple-violet);
}

@scope (#impact) {
	.top p {
		color: var(--color-tci-purple-violet);
	}
}

@scope (#stories) {
	p {
		font-size: var(--text-body);
	}
}

@scope (#featured-playlists) {
	header p {
		max-width: 65ch;
		font-weight: 700;
		color: var(--color-tci-purple-violet);
	}

	.playlist p {
		font-size: var(--text-body);
	}
}

@scope (.news-card) {
	p {
		font-size: var(--text-body);
		color: var(--color-tci-neutral-warm);
	}
}

@scope (.testimonial-aside) {
	@media (width<64rem) {
		:scope {
			position: static;
			max-width: none;
		}
	}

	@media (width >= 40rem) and (width < 64rem) {
		.portrait {
			max-width: 24rem;
		}
	}

	blockquote > p {
		font: 700 var(--text-quote) / var(--text-quote--line-height) var(--font-display);
		color: var(--color-tci-neutral-warm);
	}

	.pagination .swiper-pagination-bullet {
		width: 6px;
		height: 6px;
		margin: 0;
		background-color: var(--color-tci-purple-mist);
		opacity: 100%;
	}

	.pagination .swiper-pagination-bullet-active {
		background-color: var(--color-tci-purple-ink);
	}
}

@scope (#news) {
	:scope {
		background: linear-gradient(
			180deg,
			var(--color-tci-purple-ink) 0%,
			var(--color-tci-purple-primary) 50%,
			var(--color-tci-purple-ink) 100%
		);
	}
}

@scope (#professional-learning) {
	p {
		font-size: var(--text-body);
		color: var(--color-tci-neutral-warm);
	}
}

@scope (.program-card) {
	p {
		color: var(--color-tci-neutral-warm);
	}
}

@scope (#proof) {
	.burst {
		max-width: 80%;
	}

	.lead p {
		color: var(--color-tci-purple-violet);
	}
}

@scope (#tci-approach) {
	.intro p {
		font-size: var(--text-body-lg);
		color: var(--color-tci-neutral-warm);
	}

	.steps p {
		color: var(--color-tci-neutral-warm);
	}
}

[data-page="home"] #hero + * {
	isolation: isolate;

	&::before {
		position: absolute;
		inset-inline: 0;
		top: 0;
		z-index: -1;
		height: 100%;
		content: "";
		background-image: url("data:image/svg+xml,%3csvg%20width='1728'%20height='291'%20viewBox='0%200%201728%20291'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M-44.1688%200L-106%20291L920.519%2081.8028V0H-44.1688Z'%20fill='%23341A5E'%20/%3e%3cpath%20d='M744.506%200L702.646%20196.69L1396.51%2055.2749V0H744.506Z'%20fill='%23341A5E'%20/%3e%3cpath%20d='M1378.65%200L1349.5%20137.179L1833.36%2038.531V0H1378.65Z'%20fill='%23341A5E'%20/%3e%3c/svg%3e");
		background-repeat: no-repeat;
		background-size: 100% auto;
	}
}