/* Legal documents — Terms of Use, Privacy Policy.
   Deliberately the plainest layout on the site. These pages are read by
   someone looking for one clause, or by a regulator, not by a prospect being
   persuaded, so there is no art, no accent colour on the page furniture, and
   nothing that moves.

   Measure is 68ch rather than the notes pages' 680px. Legal prose runs to
   long sentences and a slightly wider line stops a subclause fragmenting
   across four lines. */

/* Tokens are declared per-stylesheet in this repo — there is no shared token
   file that Base.astro loads, so a page stylesheet that omits them falls back
   to browser defaults and the page renders in Times with no borders. Copied
   from notes.css so the legal pages sit in exactly the same palette and type
   as the other prose pages. */
:root {
  --bg-primary:#F0EFE9; --bg-section:#F9F9F7; --bg-dark:#091524; --bg-card:#ECEAE4;
  --bg-muted:rgba(9,21,36,0.06);
  --text-primary:#1A1B17; --text-read:rgba(9,21,36,0.82); --text-body:rgba(9,21,36,0.64);
  --text-muted:rgba(9,21,36,0.60); --text-light:#F9F9F7;
  --accent-lime:#38B6FF; --accent-teal:#2A528E;
  --border:rgba(9,21,36,0.10); --border-med:rgba(9,21,36,0.20);
  --serif:"Geist",system-ui,-apple-system,sans-serif;
  --sans:"Geist",system-ui,-apple-system,sans-serif;
  --mono:"Sometype Mono",ui-monospace,Menlo,monospace;
}
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body {
  font-family: var(--sans);
  background: var(--bg-primary);
  color: var(--text-primary);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* The page gutter the rest of the site uses, so the left edge of a legal page
   lands where every other page's does. */
.lg-wrap {
  width: min(760px, calc(100% - 2 * clamp(26px, 3.6vw, 70px)));
  margin-inline: auto;
}

.lg-head { padding: clamp(56px, 7vw, 96px) 0 0; }
.lg-eyebrow {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0;
}
.lg-head h1 {
  margin: 18px 0 0;
  font-size: clamp(34px, 5vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.024em;
  color: var(--text-primary);
}
.lg-lede {
  margin: 20px 0 0;
  font-size: clamp(17px, 1.5vw, 19px);
  line-height: 1.55;
  color: var(--text-body);
  max-width: 54ch;
}
.lg-meta {
  margin: 26px 0 0;
  padding-top: 22px;
  border-top: 1px solid var(--border);
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.lg-body {
  padding: clamp(34px, 4vw, 52px) 0 clamp(72px, 9vw, 120px);
  font-size: 16.5px;
  line-height: 1.72;
  color: var(--text-read, var(--text-body));
}
.lg-body p { margin: 0 0 20px; max-width: 68ch; }
.lg-body p:last-child { margin-bottom: 0; }

.lg-body h2 {
  margin: 52px 0 18px;
  font-size: clamp(21px, 2vw, 26px);
  line-height: 1.2;
  letter-spacing: -0.016em;
  color: var(--text-primary);
}
.lg-body h2:first-child { margin-top: 0; }
.lg-body h3 {
  margin: 34px 0 12px;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -0.008em;
  color: var(--text-primary);
}

.lg-body ul { margin: 0 0 22px; padding: 0; list-style: none; max-width: 68ch; }
.lg-body li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 11px;
}
/* a rule, not a bullet — a dot at this size reads as decoration */
.lg-body li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72em;
  width: 10px;
  height: 1px;
  background: var(--border-med, var(--border));
}
.lg-body li:last-child { margin-bottom: 0; }

/* Third-party processors: name in front, what they do behind. */
.lg-body .lg-party strong { color: var(--text-primary); font-weight: 600; }

/* The capitalised blocks.

   These stay capitalised. Warranty disclaimers and liability limits have to be
   conspicuous to be enforceable, which is the entire reason they were written
   in caps — setting them in sentence case would be a legal edit dressed up as
   a design decision, and that is not ours to make.

   What can be done is stop them shouting: a size below the body, looser
   tracking so capitals stay readable at length, and a quiet ground that marks
   them as a distinct instrument rather than emphasis. */
.lg-caps {
  margin: 30px 0;
  padding: 26px clamp(20px, 3vw, 30px);
  background: var(--bg-section);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.lg-caps p {
  margin: 0 0 16px;
  max-width: none;
  font-size: 13.5px;
  line-height: 1.66;
  letter-spacing: 0.012em;
  color: var(--text-body);
}
.lg-caps p:last-child { margin-bottom: 0; }

.lg-body a { color: var(--accent-teal); text-decoration: none; }
.lg-body a:hover { text-decoration: underline; }

@media (max-width: 620px) {
  /* the prose floor the rest of the site uses on a phone */
  .lg-body { font-size: 16px; line-height: 1.68; }
  .lg-caps { padding: 20px 18px; }
  .lg-caps p { font-size: 13px; }
  .lg-body h2 { margin-top: 40px; }
}