#agreementArticlePage {
	display: flex;
	max-width: 1240px;
	align-items: flex-start;
	gap: 20px;
	align-self: stretch;
	margin: 0 auto;

	.nav__links__wrapper {
		width: 286px;
		padding-top: 252px;
		flex-shrink: 0;
		position: sticky;
		top: -128px;
		align-self: flex-start;

		.nav__links {
			display: flex;
			flex-direction: column;
			padding-bottom: 192px;
			gap: 4px;

			.nav__links-link {
				padding: 4px 0 4px 16px;
				color: var(--text-base-tertiatry);
				font: var(--font-body-reg-sm);
				text-decoration: none;

				&.is-active {
					border-left: 2px solid var(--base-greengrey-a-400);
					padding-left: 14px;
				}
				&.is-active, &:hover {
					color: var(--text-base-primary);
				}
			}
		}
	}

	.main__content {
		padding: 80px 0;
		width: 100%;

		h1.typo_h1 {
			padding-top: 24px;
		}

		.agreement__breadcrumbs {
			display: flex;
			gap: 8px;
			align-items: center;
			margin-bottom: 0;

			ul {
				list-style: none;
				display: flex;
				gap: 4px;
				align-items: center;
				flex-wrap: wrap;

				li {
					display: flex;
					gap: 4px;
					align-items: center;
					font: var(--font-body-reg-sm);
					color: var(--text-base-secondary);

					a {
						text-decoration: none;
						color: inherit;

						&:hover {
							color: var(--text-base-primary);
						}
					}
				}
			}
		}

		.text__banner {
			margin: 32px 0;
			display: flex;
			padding: 12px 20px;
			justify-content: flex-start;
			align-items: center;
			align-self: stretch;
			border-radius: 16px;
			gap: 6px;
			border: 1px solid var(--base-greengrey-a-600);
			background: var(--base-greengrey-a-950);
			box-shadow: 0 -12px 32px 0 rgba(255, 255, 255, 0.10) inset, 0 2px 4px -1px var(--base-greengrey-a-300), 0 2px 8px -2px var(--base-greengrey-a-300);

			color: var(--text-base-invert-tertiatry);
			font: var(--font-body-reg-sm);

			span {
				color: var(--text-base-invert-primary);
				font: var(--font-body-med-sm);
			}
		}

		.text__section {
			display: flex;
			align-items: flex-start;
			gap: 40px;
			align-self: stretch;
			padding-bottom: 112px;

			.typo {
				max-width: 654px;
				padding-top: 30px;
			}
		}
	}

	.agreement__nav {
		width: 100%;
		position: sticky;
		top: 72px;
		align-self: flex-start;
		padding-top: 48px;

		.agreement__nav-inner {
			display: flex;
			flex-direction: column;
		}

		.agreement__nav-section {
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			align-self: stretch;
			border-radius: 12px;
			box-shadow: 0 0 0 1px var(--base-slate-a-150), 0 4px 4px -2px var(--base-slate-a-150), 0 12px 12px -6px var(--base-slate-a-100);
			background: var(--bg-surf-0);

			.agreement__nav-section-header {
				display: flex;
				padding: 8px 12px;
				align-items: center;
				gap: 8px;
				align-self: stretch;
				border-bottom: 0.5px solid var(--border-mid-high);
				background: var(--base-greengrey-a-50);
				color: var(--text-base-primary);
				font: var(--font-body-med-xs);
				border-radius: 11px 11px 0 0;
				user-select: none;

				ws-icon.mobile-only {
					margin-left: auto;
					display: none;
				}
			}
			.agreement__nav-anchors {
				padding: 8px 0;
				display: flex;
				flex-direction: column;
				box-sizing: border-box;
				width: 100%;

				.agreement__nav-anchor-item {
					margin: 0 16px;
					border-bottom: 1px solid var(--border-high);

					&:last-child {
						border-bottom: none;
					}

					.agreement__nav-anchor {
						display: block;
						padding: 10px 8px;
						flex: 1 0 0;

						box-sizing: border-box;
						width: 100%;
						color: var(--text-base-secondary);
						font: var(--font-body-reg-sm);
						text-decoration: none;

						&:hover {
							text-decoration-line: underline;
							text-decoration-style: solid;
							text-decoration-skip-ink: auto;
							text-decoration-color: var(--base-txt-secondary);
							text-decoration-thickness: 8%;
							text-underline-offset: 8%;
						}

						&.is-active {
							color: var(--text-base-primary);
							text-shadow: -0.03ex 0 0 currentColor, 0.03ex 0 0 currentColor;
							-webkit-text-stroke-width: 0.04ex;
						}
					}
				}
			}
		}
	}
}