.legal-page { background: #f1f0e9; }
.legal-page .site-header { position: relative; top: 12px; color: var(--ink); }
.legal-page .site-header nav { background: var(--footer); color: #fff; }

.legal-layout { display: grid; grid-template-columns: 1fr 2fr; gap: 72px; padding-block: 72px 144px; }
.legal-meta { font-size: 20px; line-height: 1.5; }
.legal-meta nav { display: grid; gap: 16px; margin-top: 36px; }
.legal-meta a { text-underline-offset: 5px; }
.legal-meta [aria-current] { font-weight: 600; }
.legal-article { max-width: 860px; }
.legal-article h1 { margin: 0 0 32px; font-size: clamp(42px, 4vw, 72px); font-weight: 380; line-height: 1.1; letter-spacing: -.01em; }
.legal-article h2 { font-size: clamp(25px, 2vw, 32px); font-weight: 600; margin-bottom: 18px; line-height: 1.25; }
.legal-article section { margin-top: 44px; }
.legal-article p, .legal-article li { font-size: 23px; line-height: 1.6; }
.legal-article p + p { margin-top: 20px; }
.legal-article .legal-intro { font-size: 27px; line-height: 1.5; }
.legal-article ul { padding-left: 1.2em; display: grid; gap: 18px; }
.legal-article a { text-underline-offset: 4px; overflow-wrap: anywhere; }
.legal-article .legal-draft, .legal-article .draft-detail { font-size: 18px; padding-left: 18px; border-left: 3px solid var(--brand); }
.legal-article .legal-draft { margin-bottom: 32px; }
@media (max-width: 850px) {
  .legal-layout { grid-template-columns: 1fr; gap: 40px; padding-block: 64px 80px; }
  .legal-meta nav { margin-top: 24px; }
  .legal-article p, .legal-article li { font-size: 20px; }
  .legal-article .legal-intro { font-size: 23px; }
}