.legal-page {
  background: var(--bg);
  color: var(--ink);
}

.legal-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 14px max(24px, calc((100vw - 1320px) / 2));
  background: rgba(249, 245, 236, .94);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
}

.legal-nav__logo img { display: block; height: 38px; width: auto; }
.legal-nav__links { display: flex; align-items: center; gap: 22px; }
.legal-nav__links a { color: var(--ink-soft); font-size: .9rem; font-weight: 500; }
.legal-nav__links a:hover { color: var(--terra); }

.legal-hero { padding: 88px 0 62px; background: var(--bg-2); border-bottom: 1px solid var(--line); }
.legal-hero h1 {
  max-width: 18ch;
  font-family: var(--font-serif);
  font-size: clamp(2.7rem, 6vw, 5.5rem);
  font-weight: 400;
  line-height: 1;
}
.legal-hero__lede { max-width: 68ch; margin-top: 24px; color: var(--ink-soft); font-size: 1.05rem; line-height: 1.7; }
.legal-hero__meta { margin-top: 20px; color: var(--ink-soft); font-size: .85rem; }

.legal-layout {
  display: grid;
  grid-template-columns: minmax(210px, 260px) minmax(0, 780px);
  justify-content: center;
  gap: clamp(40px, 7vw, 100px);
  padding-top: 70px;
  padding-bottom: 100px;
}

.legal-toc { align-self: start; position: sticky; top: 92px; }
.legal-toc strong { display: block; margin-bottom: 14px; font-size: .75rem; text-transform: uppercase; letter-spacing: .16em; color: var(--sage); }
.legal-toc ol { display: grid; gap: 8px; list-style: none; counter-reset: legal-toc; }
.legal-toc li { counter-increment: legal-toc; }
.legal-toc a { display: grid; grid-template-columns: 24px 1fr; gap: 8px; color: var(--ink-soft); font-size: .86rem; line-height: 1.4; }
.legal-toc a::before { content: counter(legal-toc, decimal-leading-zero); color: var(--terra); font-family: var(--font-serif); }
.legal-toc a:hover { color: var(--ink); }

.legal-content { min-width: 0; }
.legal-content section { scroll-margin-top: 100px; padding: 0 0 46px; margin: 0 0 46px; border-bottom: 1px solid var(--line); }
.legal-content section:last-child { border-bottom: 0; margin-bottom: 0; }
.legal-content h2 { margin-bottom: 22px; font-family: var(--font-serif); font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 400; line-height: 1.15; }
.legal-content h3 { margin: 28px 0 12px; font-size: 1rem; font-weight: 650; }
.legal-content p,
.legal-content li { color: var(--ink-soft); line-height: 1.75; }
.legal-content p + p { margin-top: 14px; }
.legal-content ol,
.legal-content ul { display: grid; gap: 9px; margin: 14px 0 0 1.25rem; }
.legal-content li::marker { color: var(--terra); font-weight: 600; }
.legal-content a { color: var(--terra); text-decoration: underline; text-underline-offset: 3px; }
.legal-content strong { color: var(--ink); font-weight: 650; }
.legal-content .legal-note { padding: 18px 0 18px 20px; margin: 22px 0; border-left: 3px solid var(--terra); color: var(--ink); }
.legal-content .legal-address { margin-top: 14px; font-style: normal; color: var(--ink-soft); line-height: 1.75; }

.legal-table-wrap { overflow-x: auto; margin-top: 20px; }
.legal-table { width: 100%; border-collapse: collapse; min-width: 650px; }
.legal-table th,
.legal-table td { padding: 14px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; line-height: 1.55; }
.legal-table th { color: var(--ink); font-size: .8rem; font-weight: 650; }
.legal-table td { color: var(--ink-soft); font-size: .88rem; }

.legal-footer { padding-top: 54px; }

@media (max-width: 820px) {
  .legal-nav { padding: 12px 20px; }
  .legal-nav__links a:not(.legal-nav__back) { display: none; }
  .legal-nav__logo img { height: 32px; }
  .legal-hero { padding: 64px 0 44px; }
  .legal-layout { grid-template-columns: 1fr; padding-top: 50px; padding-bottom: 70px; }
  .legal-toc { position: static; padding-bottom: 30px; border-bottom: 1px solid var(--line); }
  .legal-content section { padding-bottom: 36px; margin-bottom: 36px; }
}

@media print {
  .nav, .legal-toc, .footer { display: none; }
  .legal-hero { padding: 20px 0; }
  .legal-layout { display: block; padding: 24px 0; }
  .legal-content section { break-inside: avoid; }
}