.seo-content-part {
	position: relative;
	overflow: hidden;
	margin-left: var(--home-content-padding-x);
	margin-right: var(--home-content-padding-x);
	padding: 1.5rem;
	padding-right:0;
	border: 2px solid var(--brand-color-container, #e3e2fa);
	border-radius: 2rem;
	background-color: var(--color-white, #fff);
}

.seo-content-part::before,
.seo-content-part::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	z-index: 2;
	pointer-events: none;
	transition: opacity var(--transition-base, 200ms ease);
}

.seo-content-part::before {
	top: 0;
	height: 4rem;
	background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0) 100%);
}

.seo-content-part::after {
	bottom: 0;
	height: 6rem;
	background: linear-gradient(0deg, #fff 0%, rgba(255, 255, 255, 0) 100%);
}

.seo-content-part__glow {
	position: absolute;
	right: 0;
	bottom: 0;
	width: clamp(280px, 40%, 520px);
	height: auto;
	transform: translate(45%, 65%);
	z-index: 0;
	pointer-events: none;
	user-select: none;
}

.seo-content-part__toggle {
	position: absolute;
	top: 1.25rem;
	right: 1.25rem;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1rem;
	border: none;
	border-radius: var(--radius-full, 9999px);
	cursor: pointer;
	background-color: #e3e3fa;
	color: var(--brand-navy, #231d58);
	font-size: 0.875rem;
	font-weight: 500;
	font-family: inherit;
	line-height: 1.2;
	transition: opacity var(--transition-base, 200ms ease);
}

.seo-content-part__toggle:hover {
	opacity: 0.85;
}

.seo-content-part__toggle:focus-visible {
	outline: 2px dashed #f5c566;
	outline-offset: 2px;
}

.seo-content-part__toggle-icon {
	width: 12px;
	height: 12px;
	flex-shrink: 0;
	transition: transform var(--transition-base, 200ms ease);
}

.seo-content-part--expanded .seo-content-part__toggle-icon {
	transform: rotate(180deg);
}

.seo-content-part__viewport {
	position: relative;
	z-index: 1;
}

.seo-content-part__scroll {
	max-height: 320px;
	overflow-y: auto;
	padding-right:1rem;
	transition: max-height 300ms ease;
	scrollbar-width: thin;
	scrollbar-color: var(--brand-color-periwinkle, #7f7dd7) transparent;
}

.seo-content-part__scroll::-webkit-scrollbar {
	width: 6px;
}

.seo-content-part__scroll::-webkit-scrollbar-track {
	background: transparent;
}

.seo-content-part__scroll::-webkit-scrollbar-thumb {
	background-color: var(--brand-color-periwinkle, #7f7dd7);
	border-radius: var(--radius-full, 9999px);
}

.seo-content-part--expanded .seo-content-part__scroll {
	max-height: 400rem;
	overflow-y: visible;
}

.seo-content-part--expanded::before,
.seo-content-part--expanded::after {
	opacity: 0;
}

.seo-content-part__scroll {
	color: rgba(35, 29, 88, 0.8);
	font-size: 1rem;
	line-height: 1.5625;
}

.seo-content-part__scroll h1,
.seo-content-part__scroll h2,
.seo-content-part__scroll h3,
.seo-content-part__scroll h4,
.seo-content-part__scroll h5,
.seo-content-part__scroll h6 {
	color: var(--brand-navy, #231d58);
	font-weight: 800;
	line-height: 1.4;
	margin: 1.5rem 0 0.5rem;
}

.seo-content-part__scroll h1:first-child,
.seo-content-part__scroll h2:first-child,
.seo-content-part__scroll h3:first-child,
.seo-content-part__scroll h4:first-child,
.seo-content-part__scroll h5:first-child,
.seo-content-part__scroll h6:first-child {
	margin-top: 0;
}

.seo-content-part__scroll h1 {
	font-size: 1.5rem;
}

.seo-content-part__scroll h2 {
	font-size: 1.375rem;
}

.seo-content-part__scroll h3 {
	font-size: 1.25rem;
}

.seo-content-part__scroll h4,
.seo-content-part__scroll h5,
.seo-content-part__scroll h6 {
	font-size: 1.125rem;
}

.seo-content-part__scroll p {
	margin: 0 0 0.75rem;
}

.seo-content-part__scroll a {
	color: var(--brand-navy, #231d58);
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: opacity var(--transition-base, 200ms ease);
}

.seo-content-part__scroll a:hover {
	opacity: 0.7;
}

.seo-content-part__scroll ul,
.seo-content-part__scroll ol {
	margin: 0 0 0.75rem;
	padding-left: 1.5rem;
}

.seo-content-part__scroll li {
	margin-bottom: 0.25rem;
}

.seo-content-part__scroll hr {
	border: none;
	border-top: 1px solid rgba(35, 29, 88, 0.15);
	margin: 1.25rem 0;
}

.seo-content-part__scroll table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1rem;
	font-size: 0.9375rem;
}

.seo-content-part__scroll th,
.seo-content-part__scroll td {
	border: 1px solid rgba(35, 29, 88, 0.18);
	padding: 0.5rem 0.75rem;
	text-align: left;
	vertical-align: top;
}

.seo-content-part__scroll th {
	background-color: var(--brand-color-container, #e3e2fa);
	color: var(--brand-navy, #231d58);
	font-weight: 700;
}

.seo-content-part__scroll img {
	max-width: 100%;
	height: auto;
}

@media (min-width: 768px) {
	.seo-content-part {
		padding: 2rem;
		padding-right: 0;
		border-radius: 40px;
	}

	.seo-content-part__scroll {
		padding-right: 2rem;
	}
}

@media (min-width: 1024px) {
	.seo-content-part {
		background-image: url(../images/quarter-circle.svg);
		background-repeat:no-repeat;
		background-position: 101% 101%;
		background-size: 270px;
	}

	.seo-content-part__scroll {
		padding-right: 19%;
	}
}
