:root {
  --ink: #0a1224;
  --ice: #f1f5f4;
  --acid: #dfff45;
  --blue: #5b7cff;
  --display: "Avenir Next", "Century Gothic", Futura, sans-serif;
  --text: "Avenir Next", "Trebuchet MS", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: #fbfcf9; font-family: var(--text); line-height: 1.7; }
a { color: inherit; text-underline-offset: 4px; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.legal-header { display: flex; min-height: 76px; align-items: center; justify-content: space-between; padding: 0 5vw; color: var(--ice); background: var(--ink); }
.legal-header a { display: inline-flex; gap: 10px; align-items: center; font-family: var(--display); text-decoration: none; }
.legal-header b { color: var(--acid); }
.legal-header span { font-family: var(--mono); font-size: .62rem; letter-spacing: .09em; text-transform: uppercase; }
.legal-shell { display: grid; grid-template-columns: .55fr 1.45fr; min-height: calc(100vh - 76px); }
.legal-aside { padding: 6vw 5vw; color: var(--ice); background: var(--blue); }
.legal-aside p { margin: 0; font-family: var(--mono); font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.legal-aside h1 { margin: 1.2rem 0 2rem; font-family: var(--display); font-size: clamp(3rem, 6vw, 6rem); letter-spacing: -.07em; line-height: .88; }
.legal-aside small { display: block; max-width: 420px; }
.legal-content { max-width: 900px; padding: 6vw; }
.legal-content h2 { margin: 2.8rem 0 1rem; font-family: var(--display); font-size: 1.6rem; letter-spacing: -.035em; }
.legal-content h2:first-child { margin-top: 0; }
.legal-content p,
.legal-content li { color: #3c4960; }
.legal-content strong { color: var(--ink); }
.legal-content li { margin-bottom: .55rem; }
.legal-box { margin: 2rem 0; padding: 1.4rem; background: var(--acid); border-left: 6px solid var(--ink); }
.legal-box p { margin: 0; color: var(--ink); }
.legal-footer { padding: 2rem 5vw; color: #aab5c9; background: var(--ink); font-size: .75rem; }
.legal-footer a { color: var(--ice); }
@media (max-width: 760px) {
  .legal-header > span { display: none; }
  .legal-shell { grid-template-columns: 1fr; }
  .legal-aside { padding: 4rem 6vw; }
  .legal-content { padding: 4rem 6vw; }
}