/* Shared legal-page additions. Uses the existing PIE variables and base styles. */
.legal-page .site-header {
  position: relative;
  height: 78px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 92%, transparent);
}

.legal-page .site-header.is-scrolled { position: sticky; top: 0; }

.legal-main { position: relative; padding: clamp(4rem, 9vw, 7rem) var(--section-x) var(--section-y); }

.legal-main::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 58px 58px;
  mask-image: linear-gradient(to bottom, black, transparent 56%);
}

.legal-content { position: relative; z-index: 1; max-width: 880px; margin: 0 auto; }
.legal-content > .eyebrow { margin-bottom: .8rem; }
.legal-content h1 { max-width: 720px; margin-bottom: 1rem; overflow-wrap: break-word; hyphens: auto; font-size: clamp(3.1rem, 6vw, 5.7rem); line-height: .97; }
.legal-lead { max-width: 690px; margin-bottom: clamp(2.5rem, 5vw, 4rem); color: var(--muted); font-size: clamp(1rem, 1.35vw, 1.15rem); line-height: 1.72; }

.legal-section { padding: 1.65rem 0 1.9rem; border-top: 1px solid var(--line); }
.legal-section:last-of-type { border-bottom: 1px solid var(--line); }
.legal-section h2 { margin: 0 0 .85rem; font-size: clamp(1.35rem, 2.1vw, 1.75rem); line-height: 1.2; }
.legal-section p, .legal-section li { max-width: 740px; color: var(--muted); font-size: 1rem; line-height: 1.72; }
.legal-section p:last-child { margin-bottom: 0; }
.legal-section address { color: var(--muted); font-size: 1rem; font-style: normal; line-height: 1.72; }
.legal-section a { color: var(--aqua); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--aqua) 42%, transparent); text-underline-offset: .2em; }
.legal-section a:hover { color: var(--ink); text-decoration-color: currentColor; }
.legal-section code { overflow-wrap: anywhere; }
.legal-section ul { margin: .85rem 0 0; padding-left: 1.2rem; }
.legal-section li + li { margin-top: .35rem; }
.legal-note { margin-top: 1.8rem; color: var(--dim); font: 500 .72rem/1.6 var(--mono); letter-spacing: .03em; }
.legal-page .site-footer { margin-top: 0; }

@media (max-width: 780px) {
  .legal-page .site-header { height: 70px; }
  .legal-main { padding-top: 3.5rem; }
  .legal-section { padding: 1.35rem 0 1.55rem; }
  .legal-section p, .legal-section li, .legal-section address { font-size: 1rem; line-height: 1.68; }
}