/* DailyCRM — legal documents (/legal/). Uses variables, header, buttons and footer from /style.css. */
.legal-body { background: var(--paper); }
.legal-header { border-bottom-color: var(--line); }
.legal-header .header-actions { gap: 4px; }
.legal-main { background: var(--sand); padding: 48px 0 80px; }

.legal-grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 48px; align-items: start; }
.legal-aside { position: sticky; top: 96px; max-height: calc(100vh - 120px); overflow: auto; display: grid; gap: 28px; font-size: 14px; }
.legal-aside-title { font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.legal-aside ul, .legal-aside ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.legal-aside a { display: block; padding: 5px 10px; border-radius: 6px; color: var(--ink-2); line-height: 1.35; }
.legal-aside a:hover { background: var(--sand-2); color: var(--ink); }
.legal-aside a[aria-current='page'] { background: var(--paper); color: var(--accent-ink); font-weight: 600; box-shadow: var(--shadow-md); }

.legal-doc { min-width: 0; overflow-wrap: break-word; background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 48px 56px 56px; max-width: 860px; font-size: 16px; line-height: 1.65; color: var(--ink-2); }
.legal-crumbs { font-size: 14px; color: var(--muted); margin-bottom: 14px; }
.legal-crumbs a { color: var(--accent-ink); }
.legal-doc h1 { font-size: 44px; line-height: 1.08; letter-spacing: -0.018em; }
.legal-meta { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 18px 0 28px; padding: 0 0 22px; border-bottom: 1px solid var(--line); font-size: 14px; }
.legal-meta div { display: flex; gap: 6px; }
.legal-meta dt { color: var(--muted); }
.legal-meta dd { margin: 0; font-weight: 600; color: var(--ink); }
.legal-doc h2 { font-size: 26px; line-height: 1.2; letter-spacing: -0.01em; margin: 44px 0 14px; scroll-margin-top: 96px; }
.legal-doc h3 { font-family: var(--text); font-weight: 700; font-size: 17px; color: var(--ink); margin: 26px 0 8px; }
.legal-doc p, .legal-doc ul, .legal-doc ol, .legal-doc table { margin: 0 0 14px; }
.legal-doc ul { list-style: disc; padding-left: 22px; }
.legal-doc ol { list-style: decimal; padding-left: 22px; }
.legal-doc li { margin: 4px 0; }
.legal-doc li::marker { color: var(--muted); }
.legal-doc a { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
.legal-doc strong { color: var(--ink); }
.legal-doc code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.88em; background: var(--sand); border-radius: 4px; padding: 1px 5px; }
.legal-doc .caps { text-transform: uppercase; font-size: 14.5px; letter-spacing: 0.01em; }
.legal-doc .callout { background: var(--accent-soft); border-left: 3px solid var(--accent); border-radius: 0 8px 8px 0; padding: 14px 18px; color: var(--ink); }
.legal-doc table { width: 100%; max-width: 100%; border-collapse: collapse; font-size: 14.5px; line-height: 1.45; display: block; overflow-x: auto; }
.legal-doc th, .legal-doc td { text-align: left; vertical-align: top; padding: 9px 12px; border-bottom: 1px solid var(--line); }
.legal-doc th { font-weight: 600; color: var(--ink); background: var(--sand); white-space: nowrap; }
.legal-language { margin-top: 40px !important; padding-top: 18px; border-top: 1px solid var(--line); font-size: 14px; color: var(--muted); }
.ph { background: #fff3c4; color: #6b4e00; border-radius: 4px; padding: 0 4px; font-weight: 600; white-space: normal; }

.legal-toc--inline { display: none; margin: 0 0 24px; border: 1px solid var(--line); border-radius: 10px; padding: 0 16px; font-size: 15px; }
.legal-toc--inline summary { cursor: pointer; padding: 12px 0; font-weight: 600; color: var(--ink); }
.legal-toc--inline ol { list-style: none; padding: 0 0 12px; margin: 0; display: grid; gap: 2px; }
.legal-toc--inline a { text-decoration: none; display: block; padding: 4px 0; }

.legal-index { max-width: 960px; }
.legal-index h1 { font-size: 52px; line-height: 1.05; letter-spacing: -0.02em; }
.legal-lead { margin: 18px 0 32px; font-size: 18px; color: var(--ink-2); max-width: 720px; }
.legal-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.legal-card { background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 24px 26px; display: grid; gap: 10px; align-content: start; }
.legal-card h2 { font-size: 24px; line-height: 1.2; }
.legal-card h2 a:hover { color: var(--accent-ink); }
.legal-card p { color: var(--ink-2); font-size: 15px; }
.legal-card .legal-card-meta { color: var(--muted); font-size: 13.5px; }
.legal-note { margin-top: 28px; font-size: 15px; color: var(--ink-2); }

.legal-footer-grid { grid-template-columns: 2fr 1fr 1fr 1.4fr; }

@media (max-width: 1024px) {
  .legal-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .legal-aside { display: none; }
  .legal-toc--inline { display: block; }
  .legal-doc { margin: 0 auto; width: 100%; }
}
@media (max-width: 640px) {
  .legal-main { padding: 20px 0 48px; }
  .legal-main > .wrap { padding: 0 12px; }
  .legal-doc { padding: 26px 20px 32px; border-radius: 12px; font-size: 15.5px; }
  .legal-doc h1 { font-size: 32px; }
  .legal-doc h2 { font-size: 22px; margin-top: 34px; }
  .legal-index { padding: 0 8px; }
  .legal-index h1 { font-size: 36px; }
  .legal-lead { font-size: 16px; }
  .legal-cards { grid-template-columns: minmax(0, 1fr); }
  .legal-header-link { display: none; }
  .legal-footer-grid { grid-template-columns: 1fr 1fr; }
}

@media print {
  .legal-header, .legal-footer, .legal-aside, .legal-toc--inline, .skip { display: none !important; }
  .legal-main { background: #fff; padding: 0; }
  .legal-grid { display: block; }
  .legal-doc { border: 0; padding: 0; max-width: none; font-size: 11pt; color: #000; }
  .legal-doc h1 { font-size: 22pt; }
  .legal-doc h2 { font-size: 15pt; break-after: avoid; }
  .legal-doc a { color: #000; }
  .legal-doc a[href^='http']::after { content: ' (' attr(href) ')'; font-size: 9pt; color: #444; }
  .ph { background: none; border: 1px dashed #999; }
}