/* ============================================================================
   LRT redesign — DOC LAYER. Long-form utility pages (privacy, terms, 404).
   Loads after tokens.css + main.css; tokens only, no raw values.
   The boundary appears here at footer intensity: hairlines, nothing moving.
   ============================================================================ */

.doc { padding: calc(var(--nav-h) + var(--s5)) 0 var(--s6); background: var(--surface); }
.doc__in { max-width: 46rem; }

.doc__title {
  font-family: var(--font-display);
  font-stretch: var(--display-stretch);
  font-weight: 800;
  font-size: var(--t-d3);
  line-height: var(--lh-display);
  letter-spacing: var(--track-display);
  text-transform: uppercase;
  color: var(--ink-hi);
  margin: var(--s2) 0 var(--s2);
}
.doc__meta {
  color: var(--ink-dim);
  font-size: var(--t-data-lg);
  letter-spacing: var(--track-mono);
  padding-bottom: var(--s4);
  border-bottom: var(--hair) solid var(--edge-dim);
  margin-bottom: var(--s4);
}

.doc h2 {
  font-family: var(--font-display);
  font-stretch: var(--display-stretch);
  font-weight: 700;
  font-size: var(--t-d1);
  line-height: var(--lh-display);
  letter-spacing: var(--track-display);
  color: var(--ink-hi);
  margin: var(--s5) 0 var(--s2);
}
.doc h3 {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--t-lead);
  color: var(--ink-hi);
  margin: var(--s4) 0 var(--s1);
}

.doc p, .doc li { color: var(--ink-on-dark); line-height: var(--lh-body); }
.doc p { margin: 0 0 var(--s2); }
.doc ul { margin: 0 0 var(--s2); padding-left: 1.25em; list-style: disc; }
.doc li { margin-bottom: var(--s1); }
.doc li::marker { color: var(--oxide); }
.doc strong { color: var(--ink-hi); font-weight: 600; }

.doc a {
  color: var(--ink-hi);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--steel-deep);
}
.doc a:hover, .doc a:focus-visible { text-decoration-color: var(--aperture); }

/* address block — spec-plate voice */
.doc address {
  font-style: normal;
  font-family: var(--font-mono);
  font-size: var(--t-data-lg);
  letter-spacing: var(--track-mono);
  line-height: var(--lh-mono);
  color: var(--ink-on-dark);
  border-left: 2px solid var(--oxide);
  padding-left: var(--s2);
  margin: var(--s3) 0;
}

/* ---- 404 ------------------------------------------------------------------ */
/* vh first: without it the 404 has no height at all on engines predating svh */
.lost { min-height: 100vh; min-height: 100svh; display: grid; place-items: center; padding: var(--s5) 0; background: var(--surface); }
.lost__code {
  font-family: var(--font-mono);
  font-size: var(--t-data-lg);
  letter-spacing: var(--track-mono);
  /* --before (--oxide) is 2.90:1 on --surface — this is 13px text, so 4.5:1 */
  color: var(--accent-text);
  margin-bottom: var(--s2);
}
.lost__title {
  font-family: var(--font-display);
  font-stretch: var(--display-stretch);
  font-weight: 800;
  font-size: var(--t-d3);
  line-height: var(--lh-display);
  text-transform: uppercase;
  color: var(--ink-hi);
  margin-bottom: var(--s2);
}
.lost p { color: var(--ink-dim); margin-bottom: var(--s4); }
.lost__actions { display: flex; gap: var(--s2); flex-wrap: wrap; }