/* ==========================================================================
   /privacy-policy/ and /terms-of-use/ — long-form legal text.
   A title band, then the text in a 760px reading column beside a sticky
   "On this page" list. Builds on the ui-* components in site.css.
   ========================================================================== */

.legal-hero .ui-hero__inner { padding-bottom: 56px; }
.legal-hero__updated { font-size: 16px !important; color: var(--ui-muted) !important; }

.legal-layout {
	display: grid;
	grid-template-columns: 240px minmax(0, 760px);
	justify-content: center;
	gap: 72px;
	padding: 8px 20px 112px;
}

/* ------------------------------------------------------------------ TOC */
.legal-toc { position: sticky; top: calc(var(--header-h) + 32px); align-self: start; }
.legal-toc__title { margin: 0 0 12px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ui-muted); }
.legal-toc__list { margin: 0; padding: 0; list-style: none; border-left: 1px solid var(--ui-line); }
.legal-toc__list a {
	display: block;
	margin-left: -1px;
	padding: 7px 0 7px 16px;
	border-left: 2px solid transparent;
	font-size: 14.5px;
	line-height: 1.4;
	color: var(--ui-body);
	transition: color .2s, border-color .2s;
}
.legal-toc__list a:hover, .legal-toc__list a:focus { border-left-color: var(--ui-blue); color: var(--ui-ink); }

/* ----------------------------------------------------------------- text */
.legal__content { font-size: 17px; line-height: 1.75; color: var(--ui-body); }
.legal__content p { margin: 0 0 1.25em; }

.legal__content h3,
.legal__content > p[id] > b,
.legal__content > p[id] > strong {
	display: block;
	margin: 2.2em 0 .7em;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -.01em;
	color: var(--ui-ink);
}
.legal__content h3 strong { font-weight: 700; }
.legal__content > :first-child,
.legal__content > p[id]:first-child > b { margin-top: 0; }
/* the Terms number their sections in capitals; read them as headings */
.legal__content > p[id] > b,
.legal__content > p[id] > strong { font-size: 15px; letter-spacing: .06em; }
.legal__content > p[id],
.legal__content h3 { scroll-margin-top: calc(var(--header-h) + 24px); }

.legal__content b,
.legal__content strong { font-weight: 700; color: var(--ui-ink); }
.legal__content ol,
.legal__content ul { margin: 0 0 1.25em; padding-left: 1.4em; }
.legal__content li { margin-bottom: .6em; padding-left: .2em; }
.legal__content li::marker { color: var(--ui-blue); font-weight: 600; }
.legal__content li > ol,
.legal__content li > ul { margin: .6em 0 0; }
.legal__content > :last-child { margin-bottom: 0; }

@media (max-width: 1024px) {
	.legal-layout { grid-template-columns: minmax(0, 760px); padding-bottom: 88px; }
	.legal-toc { display: none; }
}

@media (max-width: 767px) {
	.legal-hero .ui-hero__inner { padding-bottom: 36px; }
	.legal-layout { padding: 0 16px 64px; }
	.legal__content { font-size: 16px; line-height: 1.7; }
	.legal__content h3 { font-size: 20px; }
}
