:root {
  --legal-navy: #05274c;
  --legal-gold: #c38b40;
  --legal-ink: #17283b;
  --legal-soft: #526273;
  --legal-paper: #f5f2ec;
}

.legal-page { margin: 0; color: var(--legal-ink); background: var(--legal-paper); }
.legal-header { min-height: 96px; padding: 1.25rem clamp(1.25rem, 5vw, 5rem); display: flex; align-items: center; justify-content: space-between; gap: 2rem; background: var(--legal-navy); }
.legal-header .brand__logo { width: 170px; }
.legal-back { color: white; font-family: Montserrat, sans-serif; font-weight: 600; text-decoration: none; }
.legal-back:hover { text-decoration: underline; text-underline-offset: .3em; }
.legal-main { padding: clamp(3rem, 7vw, 7rem) 1.25rem; }
.legal-document { width: min(800px, 100%); margin: 0 auto; padding: clamp(1.5rem, 4vw, 4.5rem); background: white; box-shadow: 0 20px 60px rgba(5, 39, 76, .08); }
.legal-document h1 { max-width: none; margin-bottom: 1.25rem; font-size: clamp(2.6rem, 7vw, 5rem); }
.legal-document h2 { margin: 0 0 .8rem; font-size: clamp(1.35rem, 3vw, 1.8rem); }
.legal-document section { padding-top: 2rem; margin-top: 2rem; border-top: 1px solid rgba(5, 39, 76, .14); }
.legal-document p, .legal-document li { color: var(--legal-soft); font-size: 1.05rem; line-height: 1.7; }
.legal-document li + li { margin-top: .35rem; }
.legal-document a { color: var(--legal-navy); text-underline-offset: .22em; }
.legal-intro { font-size: 1.25rem !important; }
.legal-meta { color: var(--legal-navy) !important; }
.legal-footer { padding: 1.5rem clamp(1.25rem, 5vw, 5rem); display: flex; justify-content: space-between; gap: 1rem; color: white; background: var(--legal-navy); }
.legal-footer a { color: white; }
.legal-inline-button { padding: 0; border: 0; color: var(--legal-navy); background: none; font: inherit; text-decoration: underline; text-underline-offset: .22em; cursor: pointer; }
.legal-footer-button { padding: 0; border: 0; color: white; background: none; font: inherit; text-decoration: underline; text-underline-offset: .22em; cursor: pointer; }

@media (max-width: 600px) {
  .legal-header, .legal-footer { align-items: flex-start; flex-direction: column; }
  .legal-document { padding: 1.4rem; }
}