/* Long-form content pages (About / FAQ / ToU). Readable parchment column on tokens; header + footer kept. */
.static-page { max-width: 720px; margin: 0 auto; padding: 2.5rem 1.25rem 4rem; font-family: var(--sans); color: var(--parch-200); line-height: 1.7; }
.static-page h1 { font-family: var(--serif); color: var(--gold); font-size: clamp(30px, 4.5vw, 42px); line-height: 1.1; margin: 0 0 .35rem; text-shadow: var(--glow-title); }
.static-page .static-lead { font-family: var(--serif); font-style: italic; font-size: 1.2rem; color: rgba(var(--cream), .85); margin: 0 0 1.75rem; }
.static-page h2 { font-family: var(--serif); color: var(--parch-100); font-size: 1.45rem; margin: 2.2rem 0 .6rem; }
.static-page p { margin: 0 0 1rem; }
.static-page a { color: var(--gold); }
.static-page ul, .static-page ol { margin: 0 0 1.25rem; padding-left: 1.4rem; }
.static-page li { margin: 0 0 .5rem; }
.static-page strong { color: var(--parch-100); }
.static-divider { border: 0; border-top: 1px solid rgba(243,201,105,.25); margin: 2.5rem 0; }

/* FAQ accordion — CSS-only <details>/<summary>, no JS. (used by the FAQ page in a later task) */
.faq-item { border: 1px solid rgba(243,201,105,.22); border-radius: 12px; background: rgba(255,255,255,.03); margin: 0 0 .7rem; overflow: hidden; }
.faq-item > summary { cursor: pointer; list-style: none; padding: 1rem 1.1rem; font-family: var(--serif); font-size: 1.08rem; color: var(--parch-100); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.faq-item > summary::-webkit-details-marker { display: none; }
.faq-item > summary::after { content: "+"; color: var(--gold); font-size: 1.3rem; line-height: 1; flex: none; }
.faq-item[open] > summary::after { content: "\2013"; }
.faq-item[open] > summary { color: var(--gold); }
.faq-answer { padding: 0 1.1rem 1.1rem; color: var(--parch-200); }
.faq-answer p { margin: 0 0 .6rem; }

/* ToU document tweaks (used later) */
.tou-meta { font-size: .9rem; color: rgba(var(--cream), .6); margin: 0 0 1.5rem; }