/* Legal and policy pages, plus the trust footer every page shares. Reuses the relay.css token block
   (the RV house ramp, Digi Red) and adds only what a long-form document needs.
   Solid colours, one accent used for meaning, sentence case, no decoration.

   NOTE: the document copy on these pages is deliberately untouched. This sheet governs presentation
   only; the wording is the operator's. */

/* Left edge aligns with the header brand and the footer (.wrap), and the text keeps a readable
   measure inside it. A centred column floats away from every other element on the page. */
.legal { max-width: var(--rv-maxw); margin: 0 auto; padding: var(--rv-s-7) var(--rv-wrap-pad) var(--rv-s-8); }
.legal > * { max-width: var(--rv-measure); }
.legal h1 { font-size: 2rem; line-height: 1.2; margin: 0 0 var(--rv-s-2); }
.legal .updated { color: var(--rv-text-dim); font-size: .92rem; margin: 0 0 var(--rv-s-6); }
/* A heading belongs to what follows it: roughly 3:1 above to below, so a section title can never
   read as floating between the block it ends and the block it opens. */
.legal h2 { font-size: 1.18rem; margin: var(--rv-s-6) 0 var(--rv-s-3); }
/* One tonal step below h2, which is what keeps two heading levels only 0.18rem apart legible as two
   levels. A neutral step, never the accent: the accent means clickable. */
.legal h3 { font-size: 1rem; margin: var(--rv-s-5) 0 var(--rv-s-2); color: var(--rv-text); }
.legal p, .legal li { line-height: 1.7; color: var(--rv-text); }
.legal p { margin: 0 0 var(--rv-s-4); }
.legal h2 + p, .legal h3 + p { margin-top: 0; }
.legal p:last-child { margin-bottom: 0; }
.legal ul { padding-left: var(--rv-s-5); margin: var(--rv-s-3) 0; }
.legal li { margin: var(--rv-s-2) 0; }
/* --head was never defined anywhere, so this resolved to the invalid-at-computed-value fallback and
   emphasis inside the policy documents silently inherited the body colour. */
.legal b { color: var(--rv-text-strong); }
/* Body-size links, so the words are strong ink and the accent is the underline. No red in this ramp
   clears the 4.5:1 body text needs, and a policy page is the last place to guess at a link. */
.legal a { color: var(--rv-text-strong); text-decoration: underline; text-underline-offset: 2px;
  text-decoration-color: var(--rv-accent); }
.legal a:hover { text-decoration-color: var(--rv-accent-contrast); }

/* A statement of fact the reader can check, not a reassurance. Used sparingly.
   The left accent bar is the house device for marking a passage as important without filling it
   with colour. It is 3px, so it takes the contrast tone rather than the fill. */
.legal .plain {
  border: 1px solid var(--rv-border-1);
  border-left-width: 3px;
  border-left-color: var(--rv-accent-contrast);
  border-radius: var(--rv-r-lg);
  background: var(--rv-surface-2);
  padding: var(--rv-s-4);
  margin: var(--rv-s-5) 0;
}
.legal .plain p:first-child { margin-top: 0; }
.legal .plain p:last-child { margin-bottom: 0; }

/* Anything the operator must fill in before this page is true. Deliberately loud: an unfinished
   legal page that looks finished is worse than an obviously unfinished one. */
.legal .todo {
  border: 1px dashed var(--rv-danger);
  border-radius: var(--rv-r-lg);
  padding: var(--rv-s-3) var(--rv-s-4);
  margin: var(--rv-s-4) 0;
  color: var(--rv-text-dim);
}
.legal .todo b { color: var(--rv-danger); }

.legal table { width: 100%; border-collapse: collapse; margin: var(--rv-s-4) 0; }
.legal th, .legal td { text-align: left; padding: var(--rv-s-3); border-bottom: 1px solid var(--rv-border-1); vertical-align: top; }
.legal th { color: var(--rv-text-strong); font-weight: 600; }

/* ── The trust footer, shared by every page ───────────────────────────────────────────────────── */
.foot-cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: var(--rv-s-5) var(--rv-s-6);
  padding: var(--rv-s-6) 0 var(--rv-s-5);
  border-bottom: 1px solid var(--rv-border-1);
}
/* The column title, with ~3:1 above to below. The space above comes from the grid gap. */
.foot-col h3 { font-size: .82rem; letter-spacing: .06em; text-transform: uppercase; color: var(--rv-text-dim); margin: 0 0 var(--rv-s-3); font-weight: 600; }
.foot-col ul { list-style: none; padding: 0; margin: 0; }
.foot-col li { margin: var(--rv-s-2) 0; line-height: 1.5; color: var(--rv-text); font-size: .92rem; }
.foot-col a { color: var(--rv-text); text-decoration: none; }
.foot-col a:hover { color: var(--rv-text-strong); text-decoration: underline; }
.foot-col .fact { color: var(--rv-text-dim); font-size: .88rem; line-height: 1.6; }
.foot-col .fact b { color: var(--rv-text-strong); font-weight: 600; }