/**
 * Text component.
 */

.rc-text {
	background: var(--paper, var(--rc-color-background));
}

.rc-text__inner {
	align-items: center;
	display: grid;
	gap: clamp(2.5rem, 6vw, 6rem);
}

.rc-text__content {
	display: grid;
	gap: var(--rc-space-m);
	max-inline-size: var(--rc-layout-reading);
}

.rc-text--align-center .rc-text__content {
	margin-inline: auto;
	text-align: center;
}

.rc-text--align-right .rc-text__content {
	margin-inline-start: auto;
	text-align: right;
}

.rc-text__content > * {
	margin-block: 0;
}

.rc-text__eyebrow {
	color: var(--rc-color-muted);
	font-size: var(--rc-font-size-small);
}

.rc-text__body > :last-child {
	margin-block-end: 0;
}

.rc-text__heading {
	font-size: clamp(2rem, 3.6vw, 3.25rem);
	line-height: 1.28;
	text-wrap: balance;
}

.rc-text__body {
	color: var(--rc-color-muted);
	font-size: clamp(1rem, 1.35vw, 1.12rem);
}

.rc-text--variant-empathy .rc-text__body ul {
	display: grid;
	gap: 0.8rem;
	list-style: none;
	margin: var(--rc-space-l) 0 0;
	padding: 0;
}

.rc-text--variant-empathy .rc-text__body li {
	background: var(--paper, var(--rc-color-background));
	border: 1px solid var(--line, var(--rc-border-color));
	border-radius: 0.8rem;
	color: var(--rc-front-navy, var(--rc-color-text));
	font-weight: 650;
	padding: 0.9rem 1rem 0.9rem 2.7rem;
	position: relative;
}

.rc-text--variant-empathy .rc-text__body li::before {
	background: var(--rc-front-blue, var(--rc-color-primary));
	border-radius: 50%;
	color: #fff;
	content: "✓";
	font-size: 0.72rem;
	font-weight: 800;
	inline-size: 1.35rem;
	inset-block-start: 1rem;
	inset-inline-start: 0.85rem;
	line-height: 1.35rem;
	position: absolute;
	text-align: center;
}

.rc-text--variant-empathy {
	background: linear-gradient(180deg, var(--paper), var(--paper-dim));
}

.rc-text--variant-empathy .rc-text__inner {
	grid-template-columns: minmax(0, 1.15fr) minmax(17rem, 0.85fr);
}

.rc-text__visual {
	aspect-ratio: 5 / 4;
	border-radius: 1.5rem;
	overflow: hidden;
	position: relative;
}

.rc-text__image {
	background: var(--paper, var(--rc-color-background));
	block-size: 100%;
	display: block;
	inline-size: 100%;
	object-fit: contain;
	padding: clamp(0.75rem, 2vw, 1.5rem);
}

.rc-text__visual--fallback {
	background: linear-gradient(145deg, var(--indigo-deep), var(--indigo));
}

.rc-text__visual-circle {
	background: rgb(255 255 255 / 0.1);
	border: 1px solid rgb(255 255 255 / 0.25);
	border-radius: 50%;
	block-size: 15rem;
	inline-size: 15rem;
	inset-block-start: -3rem;
	inset-inline-end: -3rem;
	position: absolute;
}

.rc-text__visual-line {
	background: rgb(246 243 236 / 0.92);
	border-radius: 1rem;
	block-size: 0.55rem;
	inset-inline-start: 12%;
	position: absolute;
}

.rc-text__visual-line--one {
	inset-block-start: 37%;
	inline-size: 64%;
}

.rc-text__visual-line--two {
	inset-block-start: 50%;
	inline-size: 48%;
}

.rc-text__visual-line--three {
	background: var(--line, var(--rc-border-color));
	inset-block-start: 69%;
	inline-size: 30%;
}

@media (max-width: 48rem) {
	.rc-text--variant-empathy .rc-text__inner {
		grid-template-columns: 1fr;
	}

	.rc-text__visual {
		aspect-ratio: 16 / 9;
	}
}
