/* ============================================================================
   av-legal.css — legal / policy document pages on the living layer.
   Shared by: disclosure, terms-conditions, privacy-policy, our-policies,
   enhanced-support-policy. Restrained document layout (utility, not marketing):
   a compact header + a readable prose column. Built on av-tokens + av-components.
   Monochrome + orange accent only. Day/night via data-theme.
   ========================================================================== */

/* ── Document header (compact — not a marketing hero) ────────────────────── */

.av-doc__header {
  border-bottom: 1px solid var(--av-border);
  background: var(--av-surface);
  padding: calc(64px + var(--av-space-8)) 0 var(--av-space-7);
}

.av-doc__header-inner {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 var(--av-space-5);
}

.av-doc__eyebrow {
  display: block;
  font-family: var(--av-font-display);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--av-orange);
  margin-bottom: var(--av-space-3);
}

.av-doc__title {
  font-family: var(--av-font-display);
  font-size: clamp(1.9rem, 4.5vw, 2.75rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--av-text);
  margin: 0;
}

.av-doc__updated {
  margin: var(--av-space-4) 0 0;
  font-size: 0.875rem;
  color: var(--av-text-muted);
}

/* ── Prose body (readable column) ────────────────────────────────────────── */

.av-doc {
  max-width: 760px;
  margin: 0 auto;
  padding: var(--av-space-9) var(--av-space-5) var(--av-space-10);
  color: var(--av-text-muted);
  font-size: 1rem;
  line-height: 1.75;
}

.av-doc h2 {
  font-family: var(--av-font-display);
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--av-text);
  margin: var(--av-space-8) 0 var(--av-space-4);
  padding-top: var(--av-space-7);
  border-top: 1px solid var(--av-border);
}

.av-doc h2:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.av-doc h3 {
  font-family: var(--av-font-display);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--av-text);
  margin: var(--av-space-6) 0 var(--av-space-3);
}

.av-doc p {
  margin: 0 0 var(--av-space-4);
}

.av-doc ul,
.av-doc ol {
  margin: 0 0 var(--av-space-4);
  padding-left: var(--av-space-6);
}

.av-doc li {
  margin-bottom: var(--av-space-2);
}

.av-doc a {
  color: var(--av-orange);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.15s;
}

.av-doc a:hover {
  border-bottom-color: var(--av-orange);
}

/* A component button placed inside prose (e.g. a guide CTA) must keep its own
   .av-btn colors, not inherit the prose-link orange above — otherwise
   .av-btn--primary renders orange text on its orange background and the label
   disappears. Higher specificity than `.av-doc a` and placed after it. */
.av-doc a.av-btn { border-bottom: none; }
.av-doc a.av-btn--primary,
.av-doc a.av-btn--primary:hover { color: #ffffff; }
.av-doc a.av-btn--outline,
.av-doc a.av-btn--outline:hover { color: var(--av-orange); }

.av-doc strong {
  color: var(--av-text);
  font-weight: 600;
}

.av-doc code {
  font-family: 'Courier New', Courier, monospace;
  font-size: 0.875em;
  background: var(--av-surface-raise);
  border: 1px solid var(--av-border);
  border-radius: 4px;
  padding: 0.1em 0.45em;
  color: var(--av-orange);
}

/* Inter-block spacing for the verbatim disclosure markup (legacy uses bare <br>).
   Keep readable even when source paragraphs are separated by <br> not <p>. */
.av-doc br + br { content: ''; display: block; margin-top: var(--av-space-3); }