/* Styles for the plain policy pages (terms, privacy).
   Deliberately austere — these documents work by being readable, not designed. */

.doc { padding-block: clamp(120px, 16vw, 200px) var(--section-y); }
.doc .wrap { max-width: 720px; }

.doc__back {
  display: inline-block;
  margin-bottom: var(--s8);
  font: 400 var(--t-mono)/1 var(--font-mono);
  text-transform: uppercase; letter-spacing: .18em;
  color: var(--text-muted);
  text-decoration: none;
  border-bottom: 1px solid var(--rule-strong);
  padding-bottom: 4px;
}
.doc__back:hover { color: var(--text); border-bottom-color: var(--accent); }

.doc h1 {
  font-family: var(--font-display);
  font-size: var(--t-h2);
  line-height: 1.02;
  letter-spacing: -.02em;
  margin-bottom: var(--s5);
}

.doc__updated {
  font: 400 var(--t-mono)/1 var(--font-mono);
  text-transform: uppercase; letter-spacing: .16em;
  color: var(--text-muted);
  margin-bottom: var(--s9);
}

.doc h2 {
  font-family: var(--font-display);
  font-size: 1.875rem;
  line-height: 1.2;
  margin: var(--s9) 0 var(--s5);
  padding-top: var(--s6);
  border-top: 1px solid var(--rule);
}

.doc p, .doc li { color: var(--text); max-width: 66ch; }
.doc ul { margin: 0 0 var(--s5); }
.doc ul li {
  position: relative;
  padding-left: var(--s5);
  margin-bottom: var(--s3);
}
.doc ul li::before {
  content: ""; position: absolute; left: 0; top: .7em;
  width: 5px; height: 5px; border-radius: 50%; background: var(--accent);
}
.doc strong { font-weight: 600; }

/* ═════════════════════════ PRINT ═════════════════════════
   The policy pages are not meant to be printed, but they can be, and they
   inherit the same trap intake.css documents: styles.css sets
   `color-scheme: dark` on :root, so Chrome paints the page canvas #121212 and
   the sheet arrives as a black page with a white panel on it. Three lines
   here rather than a surprise for whoever prints the terms. */
@media print {
  :root { color-scheme: light; }
  html, body { background: #fff !important; color: #000 !important; }
  .grain, .nav, .foot, .theme, .skip-link, .doc__back { display: none !important; }
}
