/* Salt Grain — text_sidebar module polish (loads after theme.css). */
/* ── text_sidebar polish (shared module; partner Why-[X] bands) ───────────── */
.sg-module-text-sidebar {
	padding: clamp(88px, 10vw, 128px) 0;
}

.sg-module-text-sidebar > .sg-container > .sg-mono {
	margin-bottom: 18px;
}

.sg-module-text-sidebar > .sg-container > .sg-display {
	margin-bottom: clamp(36px, 5vw, 56px);
	max-width: 22ch;
}

.sg-text-sidebar-grid {
	grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
	gap: clamp(40px, 6vw, 96px);
}

.sg-text-sidebar-grid--reversed {
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr);
}

.sg-text-sidebar__main {
	font-family: var(--sg-font-body);
	font-size: 18px;
	line-height: 1.75;
	color: var(--sg-ink-80);
	max-width: 38rem;
}

.sg-text-sidebar__aside {
	font-family: var(--sg-font-body);
	font-size: 15px;
	line-height: 1.65;
	color: var(--sg-ink-80);
	background: var(--sg-paper);
	border: 1px solid var(--sg-ink-14);
	border-radius: 4px;
	padding: 28px 28px 32px;
	box-shadow: 0 1px 0 rgba(4, 17, 24, 0.04);
}

.sg-text-sidebar__main p,
.sg-text-sidebar__aside p {
	margin: 0 0 1.15em;
}

.sg-text-sidebar__main p:last-child,
.sg-text-sidebar__aside p:last-child {
	margin-bottom: 0;
}

.sg-text-sidebar__main ul,
.sg-text-sidebar__aside ul,
.sg-text-sidebar__list {
	list-style: none;
	margin: 0.35em 0 1.25em;
	padding: 0;
}

.sg-text-sidebar__main ol,
.sg-text-sidebar__aside ol {
	margin: 0.35em 0 1.25em;
	padding-left: 1.35em;
}

.sg-text-sidebar__main li,
.sg-text-sidebar__aside li,
.sg-text-sidebar__list li {
	position: relative;
	padding-left: 1.35em;
	margin: 0 0 0.7em;
	line-height: 1.6;
}

.sg-text-sidebar__main li:last-child,
.sg-text-sidebar__aside li:last-child,
.sg-text-sidebar__list li:last-child {
	margin-bottom: 0;
}

.sg-text-sidebar__main ul > li::before,
.sg-text-sidebar__aside ul > li::before,
.sg-text-sidebar__list > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--sg-forest);
}

.sg-text-sidebar__aside > p:first-child {
	font-family: var(--sg-font-display);
	font-size: 18px;
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.25;
	color: var(--sg-night);
	margin-bottom: 0.85em;
}

@media (max-width: 900px) {

	.sg-text-sidebar-grid,
	.sg-text-sidebar-grid--reversed {
		gap: 32px;
	}

	.sg-module-text-sidebar > .sg-container > .sg-display {
		max-width: none;
	}

	.sg-text-sidebar__aside {
		padding: 24px;
	}
}
