.legal-body { background: #f2e7d5; color: #0b0908; }
.legal-header {
  position: sticky;
  z-index: 10;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 72px;
  padding: 10px max(20px, calc((100vw - 1120px) / 2));
  background: rgb(11 9 8 / 96%);
  color: white;
  border-bottom: 1px solid rgb(255 255 255 / 12%);
}
.legal-header .brand-mark { width: 44px; height: 44px; }
.legal-header .brand-mark img { width: 39px; height: 39px; }
.legal-header nav { display: flex; align-items: center; gap: 22px; }
.legal-header nav a:not(.button) { color: rgb(255 255 255 / 70%); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.legal-header nav a:hover { color: white; }
.legal-main { width: min(860px, calc(100vw - 36px)); margin-inline: auto; padding: 90px 0 120px; }
.legal-main .eyebrow { color: rgb(11 9 8 / 52%); }
.legal-main h1 { max-width: 800px; font-size: clamp(3.5rem, 8vw, 6.5rem); }
.legal-lead { max-width: 720px; margin-top: 26px; color: rgb(11 9 8 / 67%); font-size: 1.12rem; }
.legal-date { margin-top: 18px; color: rgb(11 9 8 / 47%); font-size: .7rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.legal-content { margin-top: 70px; }
.legal-content section { padding: 34px 0; border-top: 1px solid rgb(11 9 8 / 15%); }
.legal-content h2 { font-size: clamp(2rem, 4vw, 3rem); }
.legal-content h3 { margin-top: 26px; font-size: 1.35rem; }
.legal-content p, .legal-content li { color: rgb(11 9 8 / 69%); }
.legal-content p { margin-top: 16px; }
.legal-content ul { display: grid; gap: 9px; margin: 18px 0 0; padding-left: 22px; }
.legal-content a { color: #b82b18; text-underline-offset: 4px; }
.legal-notice { margin-top: 22px; padding: 18px 20px; background: #e6d6bd; border-left: 3px solid #e4311d; font-size: .85rem; }
.legal-footer { padding: 36px 20px; text-align: center; background: #0b0908; color: rgb(242 231 213 / 58%); font-size: .7rem; }
.legal-footer a { color: white; }
@media (max-width: 700px) {
  .legal-header .brand-name small, .legal-header nav > a:not(.button) { display: none; }
  .legal-header .button { min-height: 44px; padding-inline: 14px; font-size: .6rem; }
  .legal-main { padding-top: 64px; }
}
