/* Guides: article layout on top of /assets/site.css (.page). Tokens come from site.css :root. */
.page.article{max-width:820px}
.crumbs{margin:28px 0 0;font-size:14.5px;color:var(--muted)}
.crumbs a{color:var(--muted)}
.page.article>h1{margin-top:14px}
.byline{margin:14px 0 0;font-size:14.5px;color:var(--muted)}
.answer{margin:22px 0 0;padding:18px 20px;background:var(--card);border:1px solid var(--line-2);border-left:4px solid var(--brand);border-radius:var(--r-md);box-shadow:var(--sh-sm)}
.answer p{margin:0;color:var(--ink);font-size:18px;max-width:68ch}
.answer p+p{margin-top:8px;font-size:16px;color:var(--ink-2)}
.page>h3{font-size:20px;margin:28px 0 0;letter-spacing:-.015em}
.page>ol{margin:14px 0 0;padding-left:24px;display:grid;gap:8px}
.page>ol li{padding-left:4px}
.page .table-scroll+p,.page .table-scroll+.note{margin-top:12px}
.page table.data td.num,.page table.data th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.page table.data caption{caption-side:top;text-align:left;padding:14px 18px 0;font-weight:700;color:var(--ink)}
.formula{font:600 15px/1.6 var(--mono);background:var(--panel);border-radius:12px;padding:12px 14px;margin:14px 0 0;color:var(--ink);overflow-x:auto}
pre.code{font:13.5px/1.6 var(--mono);background:var(--panel);border-radius:12px;padding:12px 14px;margin:14px 0 0;color:var(--ink);overflow-x:auto;white-space:pre}
.cta{margin:44px 0 0;padding:24px;border-radius:var(--r-lg);background:var(--card);border:1px solid var(--line-2);box-shadow:var(--sh-md)}
.cta h2{font-size:clamp(22px,2.2vw,28px);margin:0}
.cta p{margin:10px 0 0;color:var(--ink-2);max-width:62ch}
.cta ol{margin:12px 0 0;padding-left:22px;display:grid;gap:6px;color:var(--ink-2)}
.cta .btn{margin-top:16px}
.page .faq{margin-top:16px}
.sources{margin:14px 0 0;padding-left:22px;display:grid;gap:8px;font-size:15px}
.sources li{color:var(--ink-2);overflow-wrap:anywhere}
.related{margin:14px 0 0;padding-left:22px;display:grid;gap:6px}
.guide-list{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:12px}
.guide-list a{display:block;text-decoration:none;color:var(--ink)}
.guide-list .card{transition:transform .25s ease,box-shadow .25s ease}
.guide-list a:hover .card{transform:translateY(-3px);box-shadow:var(--sh-lg)}
.guide-list strong{font-size:19px;letter-spacing:-.02em}
.guide-list p{margin:6px 0 0;color:var(--muted);font-size:15px}
.guide-list small{display:block;margin-top:8px;color:var(--brand-ink);font-weight:700;font-size:14px}
@media (prefers-reduced-motion:reduce){.guide-list a:hover .card{transform:none}}
@media (max-width:640px){
  .answer{padding:14px 16px}
  .answer p{font-size:17px}
  .cta{padding:18px}
  .page table.data td.num,.page table.data th.num{white-space:normal}
}
