/* ============================================================
   Legal pages — privacy and terms.

   These are read by two audiences with opposite needs: a customer
   skimming for "do you sell my phone number", and a reviewer at
   Google checking that specific disclosures exist. So: real
   headings, generous line height, and a measure narrow enough to
   read on a phone without pinching.
   ============================================================ */

.legalpage {
  max-width: 62ch;
  margin: 0 auto;
  padding-bottom: 48px;
}

.legalpage h1 {
  margin: 8px 0 4px;
  line-height: 1.15;
}

.legalpage .updated {
  color: var(--muted);
  font-size: .84rem;
  margin: 0 0 24px;
}

.legalpage h2 {
  font-size: 1.02rem;
  letter-spacing: .01em;
  margin: 30px 0 8px;
  padding-top: 18px;
  border-top: 1.5px solid var(--line);
}

.legalpage h2:first-of-type { border-top: 0; padding-top: 0; }

.legalpage h3 {
  font-size: .93rem;
  margin: 18px 0 6px;
}

.legalpage p,
.legalpage li {
  line-height: 1.62;
  font-size: .93rem;
}

.legalpage ul { padding-left: 20px; margin: 8px 0; }
.legalpage li { margin-bottom: 6px; }

.legalpage .lede {
  font-size: 1rem;
  line-height: 1.6;
}

/* A definition-style block for "what we keep, and for how long" */
.legalpage .keeps {
  border: 1.5px solid var(--line);
  border-radius: var(--r-sm, 8px);
  padding: 4px 14px;
  margin: 14px 0;
}
.legalpage .keeps div {
  display: flex;
  gap: 14px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
  font-size: .89rem;
}
.legalpage .keeps div:last-child { border-bottom: 0; }
.legalpage .keeps dt,
.legalpage .keeps b { flex: 1 1 55%; font-weight: 600; }
.legalpage .keeps span { flex: 1 1 45%; color: var(--muted); }

@media (max-width: 460px) {
  .legalpage .keeps div { flex-direction: column; gap: 2px; }
}

.legalpage .callout {
  background: var(--tint, #faf7f0);
  border: 1.5px solid var(--line);
  border-radius: var(--r-sm, 8px);
  padding: 13px 15px;
  margin: 16px 0;
  font-size: .89rem;
  line-height: 1.58;
}

.legalpage .backlink {
  display: inline-block;
  margin-top: 28px;
  font-size: .89rem;
}