/* The cost pages' own styles: toca.legal v22 carried these inline on cost/index.html, credit-hire.html and fixed-costs.html.
   tools/port_legal_site.py moved them out of the pages; on 9 Nov 2026 they were split by page again, so no page
   picks up another's rules. Loaded after legal.css and calc.css, before legal-pages.css; content/legal-site/index.json
   names each page's files. */

/* status tags as plain text labels (not the health badge) */
.card .tag--live{color:var(--color-accent-text)}
/* proof as text wordmarks */
.proof-bar--names{grid-template-columns:repeat(4,max-content);justify-items:start;column-gap:clamp(1.5rem,5vw,4.5rem);row-gap:var(--space-md);align-items:center}
.proof-bar--names .firm{font-family:var(--font-display);font-weight:600;font-size:1.3rem;letter-spacing:.02em;opacity:.62;white-space:nowrap;line-height:1}
.proof-bar--names .firm small{display:block;font-family:var(--font-mono);font-weight:400;font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;opacity:.9;margin-top:.3rem}
@media (max-width:640px){.proof-bar--names{grid-template-columns:repeat(2,max-content);column-gap:var(--space-xl)}}
/* the console, demoted to a strip */
.console{margin-top:var(--space-xl);display:flex;gap:var(--space-md);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.6rem;scrollbar-width:thin}
.console figure{flex:0 0 min(78vw,420px);scroll-snap-align:start;margin:0}
.console .shot{border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--color-rule),0 18px 40px -24px rgba(31,26,20,.4);aspect-ratio:16/10}
.console img{width:100%;height:100%;display:block;object-fit:cover;object-position:top left}
.console figcaption{margin-top:.6rem;font-size:.82rem;line-height:1.45;color:var(--color-muted)}
.console figcaption b{display:block;font-family:var(--font-mono);font-weight:500;font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-text);margin-bottom:.2rem}
.console-cue{display:none;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--color-muted);margin:.4rem 0 0}
@media (max-width:1100px){.console-cue{display:block}}
