@font-face {
  font-family: "Roboto Flex Legal";
  src: url("/assets/roboto-flex-legal.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 1000;
  font-stretch: 25% 151%;
  font-display: block;
}
body, body * {
  font-family: "Roboto Flex Legal", sans-serif;
  font-variation-settings: "wdth" 130, "wght" 200;
}
body :is(h1, h2, h3, h4, h5, h6),
body :is(h1, h2, h3, h4, h5, h6) * {
  font-variation-settings: "wdth" 130, "wght" 500;
}
.legal-page { margin: 0; min-height: 100vh; background: #e0e1de; color: #161716; }
.legal-header, .legal-content, .legal-footer { width: min(100% - 40px, 760px); margin-inline: auto; }
.legal-header { display: flex; align-items: center; justify-content: space-between; padding: 28px 0 12px; }
.legal-header a, .legal-footer a { color: inherit; }
.legal-header .brand { font-size: 22px; text-decoration: none; }
.legal-header nav, .legal-footer { display: flex; gap: 20px; flex-wrap: wrap; }
.legal-content { padding: 20px 0 64px; }
.legal-content h1 { font-size: clamp(34px, 6vw, 52px); margin: 0 0 8px; }
.legal-content h2 { font-size: 24px; margin: 36px 0 10px; }
.legal-content p, .legal-content li { font-size: 18px; line-height: 1.65; }
.legal-content ul { padding-left: 24px; }
.legal-content a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.legal-updated { color: #555; }
.legal-footer { padding: 24px 0 40px; border-top: 1px solid #bbb; }
@media (max-width: 520px) { .legal-header { align-items: flex-start; gap: 12px; }
  .legal-header nav { justify-content: flex-end; } }
