/* ============================================================
   components/doc.css
   The service page: About, Terms, Privacy, How-to (and, for now,
   Advertise and Contact). One centred reading column, no sidebar.
   The TOP banner still runs above the header, site-wide.
   No outer margin on the root; the page places it.

   The block is .rfi-docpage, NOT .rfi-doc: company.css already owns
   .rfi-doc for a company's download row (display:flex), and a shared
   class name is a cascade race decided by enqueue order. The distinct
   name keeps the two apart. See page.php.
   ============================================================ */
.rfi-docpage { max-width: 800px; margin: 0 auto; background: var(--rfi-surface); border-radius: var(--rfi-radius); box-shadow: var(--rfi-shadow); padding: 38px 46px 46px; }
.rfi-docpage h1 { font-family: var(--rfi-font-ui); font-size: 34px; font-weight: 600; line-height: 1.15; letter-spacing: -.3px; }
.rfi-docpage__lead { font-size: 19px; line-height: 1.55; color: var(--rfi-text-2); margin-top: 14px; }
.rfi-docpage__updated { font-size: 12.5px; color: var(--rfi-text-3); margin-top: 12px; }

/* Element selectors: the body is the_content(), which returns unclassed HTML. */
.rfi-docpage__body h2 { font-family: var(--rfi-font-ui); font-size: 22px; font-weight: 600; margin: 32px 0 12px; }
.rfi-docpage__body h3 { font-family: var(--rfi-font-ui); font-size: 19px; font-weight: 600; margin: 26px 0 10px; }
.rfi-docpage__body p { font-size: 16.5px; line-height: 1.7; margin-bottom: 16px; color: var(--rfi-text); }
.rfi-docpage__body ul, .rfi-docpage__body ol { margin: 0 0 16px 20px; }
.rfi-docpage__body li { font-size: 16.5px; line-height: 1.7; margin-bottom: 7px; }
.rfi-docpage__body a { color: var(--rfi-navy); text-decoration: underline; text-underline-offset: 2px; }
.rfi-docpage__body a:hover { color: var(--rfi-teal); }
.rfi-docpage__body img { border-radius: var(--rfi-radius-sm); margin: 0 0 16px; }
.rfi-docpage__body blockquote { border-left: 3px solid var(--rfi-navy); padding: 2px 0 2px 18px; margin: 24px 0; font-size: 18px; line-height: 1.6; }
.rfi-docpage__body table { width: 100%; border-collapse: collapse; margin-bottom: 16px; }
.rfi-docpage__body th, .rfi-docpage__body td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--rfi-border-soft); font-size: 15px; }

.rfi-docpage__cta { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--rfi-border-soft); display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }

@media (max-width: 700px) { .rfi-docpage { padding: 24px 20px 30px; } .rfi-docpage h1 { font-size: 27px; } }
