/* Hallmark · checked: 2026-11-11 · genre: playful (inferred)
 * floor: 0 FAIL · fixed: 7a, 19, 25, 48, 54, 63, 67, 78, F1, F19 · dismissed: 72 · structural: 1 printed (58)
 * built: the project · redesign: polish · v2.0.0 */
/* Shared styles for the support and privacy pages (loads after site.css, uses its tokens). */
.page { padding: 120px 0 80px; }
.page .wrap { max-width: 820px; }
.page h1 { font-size: clamp(44px, 8vw, 80px); margin: 0 0 12px; }
.page h2 { font-size: clamp(36px, 4.5vw, 52px); margin: 56px 0 12px; }
.page h3 { font-size: 24px; margin: 28px 0 8px; }
.page p, .page li { color: var(--text-2); font-size: 18px; max-width: 36em; }
.page ul { padding-left: 24px; }
.page li { margin: 8px 0; }
.page .meta { font: 400 16px var(--body); color: var(--dim); margin: 0 0 20px; }
.page .lead { font-size: 20px; color: var(--text); }
.page a { color: var(--amber); }
.page code { font-family: var(--mono); font-size: .9em; background: color-mix(in srgb, var(--amber) 10%, transparent); padding: 0 4px; border-radius: 4px; }
.faq details { border: 1px solid var(--edge); border-radius: 12px; background: color-mix(in srgb, var(--panel) 60%, transparent); margin: 12px 0; padding: 0 20px; }
.faq summary { cursor: pointer; padding: 16px 0; font: 800 22px/1.1 var(--display); text-transform: uppercase; color: var(--paper); list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.faq summary:hover { color: var(--amber); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--amber); font-family: var(--mono); }
.faq details[open] summary::after { content: "–"; }
.faq details > *:not(summary) { margin-top: 0; }
/* Hallmark · dismissed 72 · the render tier measures answers inside closed <details>; open answers sit 16px clear of the box */
.contact-card { margin: 28px 0; padding: 28px; border-radius: 16px; border: 1px solid var(--line-strong); background: radial-gradient(ellipse at 0 0, color-mix(in srgb, var(--amber) 12%, transparent), transparent 60%), var(--panel-3); }
.contact-card h2 { margin-top: 0; }
.contact-card .btn { height: 52px; color: var(--on-amber); background: var(--amber); border: 0; margin-top: 8px; }
.contact-card .btn:hover { background: var(--amber-hi); }
.contact-card .btn:active { background: var(--amber-lo); }
.back { display: inline-block; font: 400 16px var(--body); text-decoration: none; margin-bottom: 28px; }
.back:hover { text-decoration: underline; }