/* /shared/agreement-body.css
   The agreement DOCUMENT ITSELF: the prose that shared/csa-content.js and
   shared/audit-terms.js emit, styled as numbered sections, a statement-of-work
   rail, and Moonraker's execution block.

   Split out of shared/agreement-document.css on 2026-09-16 so that all four
   surfaces that display an agreement read the same rules: the three reference
   pages, the print edition built by scripts/build-agreement-pdf.js, and the
   signing panel in the client portal (_templates/onboarding.html). Before the
   split the portal had its own prose styling, so a client signed a document
   that did not look like the one they had been reading.

   Everything here is scoped to .doc-body and is self-contained: the portal has
   no .doc-page wrapper, so the custom properties and the base typography the
   wrapper used to supply are declared on .doc-body itself. The values are the
   same ones agreement-document.css declares, so the pages render unchanged.

   Deliberately NOT here: .doc-body .csa-header{display:none}. Hiding the
   parties block is a decision for the page and print surfaces, which carry
   their own cover; the portal has no cover and must show it. That rule stays
   in agreement-document.css. */

.doc-body{--doc-paper:#FFFFFF;--doc-ink:#1E2A5E;--doc-body:#333F70;--doc-muted:#6B7599;--doc-line:#E2E8F0;--doc-line-strong:#C9D3DE;--doc-green:#00CA8A;--doc-green-ink:#00885D;--doc-green-tint:#E1F8EB;--doc-navy:#141C3A;--doc-tint:#F7FDFB;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--doc-body);line-height:1.7;-webkit-font-smoothing:antialiased;
  counter-reset:sec;font-size:.9375rem}

/* Base typography the .doc-page wrapper supplies on the agreement pages,
   restated so this file also stands on its own inside the portal. */
.doc-body h4{font-family:'Outfit',sans-serif;color:var(--doc-ink);line-height:1.15}
.doc-body h3{font-family:'Outfit',sans-serif;color:var(--doc-ink);line-height:1.15}
.doc-body p{margin:0 0 1rem}
.doc-body a{color:var(--doc-green-ink);text-decoration:underline;text-underline-offset:3px}

.doc-body h4{counter-increment:sec;font-size:1.125rem;font-weight:700;margin:2.5rem 0 .75rem;padding-top:1.25rem;border-top:1px solid var(--doc-line);display:flex;align-items:baseline;gap:.85rem;scroll-margin-top:1.5rem}
.doc-body h4::before{content:counter(sec,decimal-leading-zero);font-family:'Outfit',sans-serif;font-weight:600;font-size:.8rem;letter-spacing:.06em;color:var(--doc-green-ink);flex:none;min-width:1.6rem}
.doc-body p{font-size:.9375rem;line-height:1.75;max-width:72ch}
.doc-body p strong{color:var(--doc-ink)}
.doc-body ul{margin:0 0 1rem 1.25rem;padding:0;max-width:72ch}
.doc-body ul li{margin:0 0 .5rem;line-height:1.7}
.doc-body ul li strong{color:var(--doc-ink)}
.doc-body .csa-payment-options{list-style:none;margin:0 0 1rem;padding:0}
.doc-body .csa-payment-options li{padding:.6rem .9rem;border:1px solid var(--doc-line);border-radius:8px;margin:0 0 .5rem;background:var(--doc-tint)}
.doc-body .dynamic-field{color:var(--doc-ink)}

/* statement of work: numbered rail */
.doc-body ol{list-style:none;margin:.5rem 0 1.5rem;padding:0;counter-reset:step;max-width:72ch}
.doc-body ol li{counter-increment:step;position:relative;display:block;padding:0 0 1.25rem 2.75rem;min-height:2rem;line-height:1.7}
.doc-body ol li::before{content:counter(step);position:absolute;left:0;top:.1rem;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--doc-navy);color:#F4FAF7;font-family:'Outfit',sans-serif;font-weight:600;font-size:.8rem;display:flex;align-items:center;justify-content:center}
.doc-body ol li::after{content:'';position:absolute;left:calc(.875rem - .5px);top:2rem;bottom:0;width:1px;background:var(--doc-line-strong)}
.doc-body ol li:last-child::after{display:none}
.doc-body ol li>strong{display:block;color:var(--doc-ink);font-family:'Outfit',sans-serif;font-weight:600;font-size:1rem;margin:.1rem 0 .15rem}
/* Execution block: Moonraker's signature at the end of every edition. */
.doc-body .csa-executed{margin:1rem 0 0;padding:1.25rem 1.5rem;border:1px solid var(--doc-line);border-radius:10px;max-width:30rem;break-inside:avoid;page-break-inside:avoid}
.doc-body .csa-executed p{margin:0 0 .35rem}
.doc-body .csa-executed-sig img{display:block;height:96px;width:auto;margin:0 0 .5rem}

@media print{
  .doc-body{font-size:10.25pt}
  .doc-body p,.doc-body ul{font-size:10.25pt;line-height:1.6;max-width:none;orphans:3;widows:3}
  .doc-body h4{font-size:12.5pt;margin:1.6rem 0 .5rem;padding-top:.9rem;break-after:avoid;break-inside:avoid}
  .doc-body h4+p,.doc-body h4+ul,.doc-body h4+ol{break-before:avoid}
  .doc-body ol li{break-inside:avoid;padding-bottom:.9rem;max-width:none}
  .doc-body ol li::before{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .doc-body .csa-payment-options li{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .doc-body a[href^="http"]::after{content:" (" attr(href) ")";font-size:8.5pt;color:#6B7599}
}