/* Document-page BODY styles — /faq, /user-guide (and the three legal pages once retrofitted).
   Navbar + footer are NOT here; they are shared chrome in inc/chrome.css, which every page loads.
   Palette is the homepage's: ground #1c2430, accent #FFB800, secondary #8a919c, body #3c4250.
   The homepage's .reveal/.memory choreography is deliberately absent — a help page wants a readable
   column, a term list and a way back to the index. */

:root {
	--ground:    #1c2430;
	--accent:    #FFB800;
	--secondary: #8a919c;
	--body:      #3c4250;
	--rule:      rgba(0, 0, 0, 0.08);
	--surface:   #f7f8fa;
}

html, body { margin: 0; padding: 0; font-family: "Arial", sans-serif; color: var(--ground); line-height: 1.6; }

/* --- the reading column --- */
.doc { max-width: 760px; margin: 0 auto; padding: 150px 20px 80px; }
@media only screen and (max-width: 800px) { .doc { padding-top: 90px; } }
.doc h1 { font-size: 2.3em; margin: 0 0 6px; line-height: 1.2; }
.doc h2 { font-size: 1.3em; margin: 38px 0 10px; }
.doc p, .doc li { color: var(--body); }
.doc a { color: var(--ground); }
.doc a:hover { color: var(--ground); text-decoration-color: var(--accent); text-decoration-thickness: 2px; }
.doc code { background: var(--surface); border-radius: 3px; padding: 1px 5px; font-size: 0.92em; }
.doc .updated, .doc .lede { color: var(--secondary); }
.doc .lede { font-size: 1.15em; margin: 0 0 36px; }

/* --- FAQ index --- */
.faq-group { margin: 0 0 34px; }
.faq-group h2 { margin-bottom: 8px; }
.faq-list { list-style: none; margin: 0; padding: 0; }
.faq-list li { border-bottom: 1px solid var(--rule); }
.faq-list li:first-child { border-top: 1px solid var(--rule); }
/* The left padding is permanent, not applied on :hover — the accent bar appears in that gutter, and
   padding that arrives with the bar would shift the text sideways under the pointer. */
.faq-list a { display: block; padding: 12px 2px 12px 4pt; text-decoration: none; color: var(--ground); }
.faq-list a:hover { color: var(--ground); background: var(--surface); box-shadow: inset 3px 0 0 var(--accent); }

/* --- answer pages --- */
.faq-back { display: inline-block; margin: 0 0 18px; font-size: 0.92em; color: var(--secondary); text-decoration: none; }
.faq-back:hover { color: var(--ground); }
.faq-meta { color: var(--secondary); font-size: 0.9em; margin: 0 0 34px; }

/* Wide content scrolls inside its own box rather than making the page scroll sideways on a phone. */
.terms { width: 100%; border-collapse: collapse; margin: 18px 0 26px; display: block; overflow-x: auto; }
.terms th, .terms td { text-align: left; vertical-align: top; padding: 10px 14px 10px 0; border-bottom: 1px solid var(--rule); }
.terms th { color: var(--ground); font-size: 0.85em; text-transform: uppercase; letter-spacing: 0.04em; }
.terms td { color: var(--body); }
.terms td:first-child { white-space: nowrap; }

.doc figure { margin: 24px 0; }
.doc figure img { max-width: 100%; height: auto; border-radius: 6px; }
.doc figcaption { color: var(--secondary); font-size: 0.9em; margin-top: 8px; }