.legal-sect {
	display: flex;
	flex-direction: column;
	--pat-url: url('/static/img/patterns/pattern_078.webp?v=d583705');
	--pat-size: 460px;
	--pat-opacity: .05;
	--pat-blend: overlay;
}

.legal-layout {
	padding-top: clamp(30px, 5vw, 60px);
	padding-bottom: clamp(60px, 8vw, 100px);
}

.legal-head {
	max-width: 44ch;
	margin-bottom: clamp(30px, 4vw, 48px);
}

.legal-head h1 {
	font-size: clamp(30px, 4.4vw, 56px);
	line-height: 1.02;
	margin: 0 0 18px;
}

.legal-head p {
	font-size: clamp(15px, 1.6vw, 17px);
	line-height: 1.6;
	opacity: .8;
	margin: 0;
}

.legal-stamp {
	font-family: var(--mono-font);
	font-size: 12px;
	letter-spacing: .12em;
	text-transform: uppercase;
	opacity: .6;
	margin-top: 14px;
}

.legal-body {
	display: flex;
	flex-direction: column;
	gap: 18px;
	max-width: 78ch;
}

.legal-item { padding: 26px 28px 28px; }

.legal-item h2 {
	font-family: var(--display-font);
	font-size: 17px;
	letter-spacing: -.02em;
	text-transform: uppercase;
	margin: 0 0 14px;
}

.legal-item h3 {
	font-size: 15px;
	font-weight: 700;
	margin: 22px 0 8px;
}

.legal-item h3:first-of-type { margin-top: 0; }

.legal-item p {
	font-size: 15px;
	line-height: 1.65;
	opacity: .82;
	margin: 0 0 12px;
}

.legal-item p:last-child { margin-bottom: 0; }

.legal-item ul {
	font-size: 15px;
	line-height: 1.65;
	opacity: .82;
	margin: 0 0 12px;
	padding-left: 20px;
}

.legal-item li { margin-bottom: 7px; }

.legal-item a {
	color: var(--accent);
	text-underline-offset: 3px;
}

.legal-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	margin-bottom: 12px;
}

.legal-table th,
.legal-table td {
	text-align: left;
	vertical-align: top;
	padding: 10px 14px 10px 0;
	border-bottom: 1px solid color-mix(in srgb, var(--fg) 16%, transparent);
}

.legal-table th {
	font-family: var(--mono-font);
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	opacity: .7;
}

.legal-table td { opacity: .82; line-height: 1.55; }

.legal-table code {
	font-family: var(--mono-font);
	font-size: 13px;
}

.legal-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: clamp(30px, 4vw, 48px);
}

.legal-nav a {
	font-family: var(--mono-font);
	font-size: 12px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--accent);
	text-underline-offset: 3px;
}
