/* site.css: everything below the fold. Values come from tokens.css. */
section{padding-block:var(--section-pad);border-top:1px solid var(--rule)}
section:first-of-type{border-top:0}
h2{margin-bottom:var(--heading-gap)}
h3{margin-bottom:var(--heading-gap)}
h2+.grid,h2+.exhibits,h2+.steps,h2+.tablewrap{margin-top:var(--space-l)}
.prose{max-width:var(--measure);color:var(--ink)}
.prose p+p,.prose ul+p,.prose p+ul{margin-top:var(--stack-gap)}
.prose strong{color:var(--ink);font-weight:600}
.prose ul{padding-left:var(--space-m)}.prose li{margin-top:var(--space-2xs)}
a:not(.btn){text-decoration-color:var(--rule-strong)}
@media (hover:hover){a:not(.btn):hover{text-decoration-color:var(--slate)}}
a:not(.btn):focus-visible,a:not(.btn):active{text-decoration-color:var(--slate)}
[id]{scroll-margin-top:calc(var(--nav-h) + var(--space-s))}
code,.mono{font-family:var(--font-mono);font-size:var(--step--1)}
p code,li code,td code{font-size:1em} /* Ratio Mono is x-height matched to Text: inline code at text size */
.grid{display:grid;gap:var(--card-gap);grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));margin-top:var(--space-l)}
.card{border:1px solid var(--rule);background:var(--surface);padding:var(--card-pad);border-radius:var(--radius)}
.card.featured{border-color:var(--rule-strong)}
.card p{color:var(--ink);font-size:var(--step-0)}.card p+p{margin-top:var(--space-xs)}
.tag{display:inline-block;font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border:1px solid var(--rule-strong);padding:var(--space-3xs) var(--space-2xs);margin-bottom:var(--space-xs);border-radius:var(--radius)}
.tag.soon{color:var(--muted);border-style:dashed}
.price{font-family:var(--font-head);font-variant-numeric:lining-nums;font-size:var(--step-2);line-height:var(--lh-snug);color:var(--ink);margin:var(--space-2xs) 0 var(--space-xs)}
.price small{display:block;font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:.06em;color:var(--muted)}
.exhibits{display:grid;gap:var(--card-gap);grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));margin-top:var(--space-l)}
.exhibit{border:1px solid var(--rule);border-top:2px solid var(--rule-strong);background:var(--surface);padding:var(--card-pad);border-radius:var(--radius)}
.exh-id{font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:.14em;color:var(--muted);margin-bottom:var(--space-xs)}
.exh-claim{font-family:var(--font-head);font-size:var(--step-1);line-height:var(--lh-snug);font-weight:400;color:var(--ink)}
.exh-src{font-family:var(--font-mono);font-size:var(--step--2);color:var(--muted);margin-top:var(--space-xs)}
.tablewrap{overflow-x:auto;margin-top:var(--space-m);border:1px solid var(--rule);border-radius:var(--radius)}
table{border-collapse:collapse;width:100%;font-family:var(--font-text);font-size:var(--step--1);font-variant-numeric:tabular-nums lining-nums}
caption{font-family:var(--font-text);font-style:italic;text-align:left;padding:var(--space-xs) var(--space-s);color:var(--muted);font-size:var(--step--1)}
th,td{text-align:left;padding:var(--space-xs) var(--space-s);border-top:1px solid var(--rule);vertical-align:top}
th{font-family:var(--font-mono);color:var(--muted);font-weight:400;font-size:var(--step--2);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
tr.hl td,tr.hl th{background:var(--surface);color:var(--ink)}
.sev{font-family:var(--font-stamp);font-weight:600;font-size:var(--step--2);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.sev.critical{color:var(--sev-critical)}.sev.high{color:var(--sev-high)}.sev.medium{color:var(--sev-medium)}.sev.low{color:var(--sev-low)}.sev.info{color:var(--sev-info)}
.ok,.pass,.verified{color:var(--verdigris)}
/* verified/passed: OUTLINED check badge (transparent, 1px verdigris) so it never reads as a button */
.badge-ok{display:inline-flex;align-items:center;gap:var(--space-2xs);font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:.08em;text-transform:uppercase;color:var(--verdigris);background:transparent;border:1px solid var(--verdigris);border-radius:var(--radius);padding:0 var(--space-2xs);vertical-align:middle}
.badge-ok svg{width:.9em;height:.9em;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.redact{display:inline-block;min-width:7ch;height:1em;vertical-align:-.15em;background:var(--muted);border-radius:var(--radius)}
.note{border-left:2px solid var(--rule-strong);padding:var(--space-xs) var(--space-s);margin-top:var(--space-m);color:var(--ink);font-size:var(--step--1);max-width:var(--measure)}
.todo{font-family:var(--font-mono);font-size:var(--step--2);color:var(--muted);border:1px dashed var(--rule-strong);padding:0 var(--space-2xs);border-radius:var(--radius)}
.steps{list-style:none;counter-reset:s;display:grid;gap:var(--space-s);grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));margin-top:var(--space-l)}
.steps li{counter-increment:s;border-top:2px solid var(--rule-strong);padding-top:var(--space-xs);font-size:var(--step--1);color:var(--ink)}
.steps li::before{content:"0" counter(s);display:block;font-family:var(--font-mono);color:var(--muted);font-size:var(--step--2)}
.steps li b{display:block;color:var(--ink);font-weight:400;font-size:var(--step-0)}
.steps li span{display:block;font-family:var(--font-mono);font-size:var(--step--2);color:var(--muted);margin-top:var(--space-2xs)}
.status-row dd{font-family:var(--font-mono)}
.status-row{display:flex;justify-content:space-between;gap:var(--space-s);border-top:1px solid var(--rule);padding:var(--space-xs) 0;font-family:var(--font-mono);font-size:var(--step--1);flex-wrap:wrap}
.status-row dt{color:var(--muted)}.status-row dd{color:var(--ink)}
.dot{display:inline-block;width:var(--space-xs);height:var(--space-xs);border-radius:50%;background:var(--muted);margin-right:var(--space-2xs)}
.dot.ok{background:transparent;border:1px solid var(--verdigris)}.dot.pending{background:var(--muted)}
.footer{border-top:1px solid var(--rule);padding:var(--space-l) 0;font-size:var(--step--1);color:var(--muted)}
.footer .wrap{display:grid;gap:var(--space-m);grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr))}
.footer ul{list-style:none}.footer li{margin-top:0}.footer li a{display:inline-flex;align-items:center;min-height:var(--target)}
.footer small{display:block;color:var(--muted);font-family:var(--font-mono);font-size:var(--step--2);line-height:var(--lh-body)}
.footer .powered{margin-top:var(--space-s);font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:.04em;color:var(--muted)}.footer .powered b{font-family:var(--font-head);font-weight:600;font-size:var(--step--1);letter-spacing:0;color:var(--ink)}
@media (max-width:30rem){.btn{width:100%;text-align:center}.page-head{padding-top:var(--space-l)}th,td{padding:var(--space-2xs) var(--space-xs)}}
/* pricing: payment terms and scope limits inside the card */
.terms{margin-top:var(--space-s);font-size:var(--step--1)}
.scope{margin-top:var(--space-xs);font-size:var(--step--1)}
.scope dt{font-family:var(--font-mono);font-size:var(--step--2);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:var(--space-xs)}
.scope dd{margin:var(--space-3xs) 0 0}
.card-ctas{margin-top:var(--space-s)}
.anchor-note{margin-bottom:var(--space-m)}
/* contact form: feedback uses ink/muted/verdigris only (rust is reserved for high/critical findings) */
.cform{display:none;gap:var(--space-s);max-width:34rem}
.js .cform{display:grid}
.field{display:grid;gap:var(--space-3xs)}
.field label{font-family:var(--font-form);font-weight:400;font-size:var(--step--2);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.field .opt{text-transform:none;letter-spacing:0}
.cform input,.cform textarea{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--rule-strong);border-radius:var(--radius);padding:var(--space-2xs) var(--space-xs);min-height:var(--target);width:100%}
.cform textarea{resize:vertical}
.cform input:focus-visible,.cform textarea:focus-visible{outline:2px solid var(--slate);outline-offset:1px;border-color:var(--slate)}
.cform [aria-invalid="true"]{border-color:var(--ink);border-width:2px}
.cform button[aria-busy="true"]{cursor:progress;opacity:.75}
.form-status{min-height:1.6em;font-size:var(--step--1);color:var(--muted)}
.form-status[data-state="success"]{color:var(--ink);border:1px solid var(--verdigris);border-radius:var(--radius);padding:var(--space-xs) var(--space-s)}
.form-status[data-state="error"]{color:var(--ink);border:1px solid var(--rule-strong);border-left:3px solid var(--ink);border-radius:var(--radius);padding:var(--space-xs) var(--space-s)}
.form-status strong{font-family:var(--font-form);font-weight:400;font-size:var(--step--2);letter-spacing:.06em;text-transform:uppercase;margin-right:var(--space-2xs)}
.form-status[data-state="success"] strong{color:var(--verdigris)}
.next{padding-left:1.2em;margin-top:var(--space-xs)}.next li{margin-top:var(--space-2xs)}
@media (prefers-reduced-motion:reduce){.btn,.btn:hover,.btn:active{transition:none;transform:none}}
/* booking widget (booking.js). There is no sound toggle. CTAs solid verdigris; Suggested and Booked are outlines;
   errors ink + slate (rust is reserved for high/critical findings and never appears here); brass is not used on controls. */
.bk{display:none;margin-top:var(--space-m);max-width:44rem}
.js .bk{display:block}
.bk-form{margin-bottom:var(--space-s)}
.cform select{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--rule-strong);border-radius:var(--radius);padding:var(--space-2xs) var(--space-xs);min-height:var(--target);width:100%}
.cform select:focus-visible{outline:2px solid var(--slate);outline-offset:1px;border-color:var(--slate)}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.bk-msg{max-width:var(--measure)}
.bk-meta{font-size:var(--step--1);color:var(--muted)}
.bk-step:focus,.bk-summary:focus{outline:none}
.bk-slots{margin-top:var(--space-s)}
.bk-day{margin-top:var(--space-s)}
.bk-day h3{font-family:var(--font-form);font-size:var(--step--2);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:400}
.bk-times{display:flex;flex-wrap:wrap;gap:var(--space-2xs);margin-top:var(--space-2xs)}
.slot{display:inline-flex;align-items:center;gap:var(--space-2xs);min-height:var(--target);min-width:var(--target);padding:var(--space-2xs) var(--space-s);font:inherit;font-family:var(--font-form);font-variant-numeric:tabular-nums;font-size:var(--step--1);color:var(--ink);background:var(--surface);border:1px solid var(--rule-strong);border-radius:var(--radius);cursor:pointer;touch-action:manipulation}
.slot.suggested{border-color:var(--verdigris)}
.slot .sug{font-size:var(--step--2);letter-spacing:.08em;text-transform:uppercase;color:var(--verdigris)}
@media (hover:hover){.slot:hover{border-color:var(--slate)}}
.slot:focus-visible{outline:2px solid var(--slate);outline-offset:2px}
.slot:active{background:rgba(159,179,200,.12)}
.slot[aria-busy="true"]{cursor:progress;opacity:.75}
.slot.gone{text-decoration:line-through;opacity:.5}
.bk-when{font-family:var(--font-head);font-size:var(--step-1)}
.bk-links{margin-top:var(--space-xs)}
.bk-status{min-height:1.6em;margin-top:var(--space-s);font-size:var(--step--1);color:var(--muted)}
.bk-status[data-state="error"]{color:var(--ink);border:1px solid var(--rule-strong);border-left:3px solid var(--slate);border-radius:var(--radius);padding:var(--space-xs) var(--space-s)}
.bk-status[data-state="booked"]{color:var(--ink)}
.booked{display:inline-flex;align-items:center;gap:var(--space-xs);border:1px solid var(--verdigris);border-radius:var(--radius);padding:var(--space-xs) var(--space-s);color:var(--ink);font-size:var(--step-0)}
.booked svg{flex:none;width:1.2em;height:1.2em;fill:none;stroke:var(--verdigris);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:bk-draw .18s var(--ease) forwards}
@keyframes bk-draw{to{stroke-dashoffset:0}}
.cform button[aria-busy="true"],.bk button[aria-busy="true"]{cursor:progress;opacity:.75}
@media (prefers-reduced-motion:reduce){.booked svg{animation:none;stroke-dashoffset:0}}
/* ---- /contact without a public endpoint: hide what cannot work, say so (config.js sets html.contact-live) ---- */
html:not(.contact-live) [data-live-only]{display:none!important}
html.contact-live [data-offline-only]{display:none!important}
.offline-note{margin-top:0}
/* ---- /sample-report audit explorer (audit-viz.js). Colour carries meaning only:
   ink = structure, muted dashed = assignment that proves nothing (weaker line reads as weaker guarantee),
   rust = critical only (with a CRITICAL text label: never colour alone), slate = selection/focus (same as links/focus),
   verdigris = controls (same as every button). Motion = order of the audit stages, one pass; none under reduced motion. */
.vz{margin-top:var(--space-m)}
.vz-steps{list-style:none;display:flex;flex-wrap:wrap;gap:var(--space-2xs);padding:0;margin:0 0 var(--space-s)}
.vz-step{min-height:var(--target);font:inherit;font-family:var(--font-mono);font-size:var(--step--1);color:var(--muted);background:transparent;border:1px solid var(--rule-strong);border-radius:var(--radius);padding:0 var(--space-s);cursor:pointer;transition:color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
.vz-step:hover{color:var(--ink);border-color:var(--verdigris)}
.vz-step[aria-pressed="true"]{color:var(--verdigris);border-color:var(--verdigris)}
.vz-step-n{opacity:.7;margin-right:.3em}
.vz-grid{display:grid;grid-template-columns:var(--col-major) var(--col-minor);gap:var(--space-m);align-items:start}
@media (max-width:860px){.vz-grid{grid-template-columns:1fr}}
.vz-fig{margin:0;background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:var(--space-xs)}
.vz-svg{display:block;width:100%;height:auto;font-family:var(--font-mono)}
.vz-tpl{fill:none;stroke:var(--rule-strong);stroke-width:1}
.vz-tpl.inner{stroke-dasharray:2 4}
.vz-tpl-l{fill:var(--muted);font-size:12px}
.vz-edge line{stroke:var(--ink);stroke-width:1.6;fill:none}
.vz-edge.asg line{stroke:var(--muted);stroke-dasharray:.02 .02}
.vz-edge text{fill:var(--muted);font-size:11px}
.vz-arrhead{fill:var(--muted)}
.vz-hit{fill:transparent}
.vz-ring{fill:var(--ground);stroke:var(--ink);stroke-width:1.6;transition:stroke var(--dur) var(--ease)}
.vz-core{fill:var(--ink)}
.vz-name{fill:var(--ink);font-size:13px}
.vz-crit-l{fill:var(--sev-critical);font-size:11px;font-weight:700;letter-spacing:.1em}
.vz-badge circle{fill:var(--surface);stroke:var(--muted);stroke-width:1}
.vz-badge text{fill:var(--ink);font-size:11px}
.vz[data-stage="3"] .sev-medium .vz-ring,.vz[data-stage="3"] .sev-low .vz-ring,.vz[data-stage="3"] .sev-critical .vz-ring,
.vz[data-stage="4"] .sev-medium .vz-ring,.vz[data-stage="5"] .sev-medium .vz-ring{stroke:var(--muted);stroke-dasharray:4 3}
.vz[data-stage="4"] .sev-critical .vz-ring,.vz[data-stage="5"] .sev-critical .vz-ring{stroke:var(--sev-critical);stroke-width:2.4;stroke-dasharray:none}
.vz[data-stage="4"] .sev-critical .vz-badge circle,.vz[data-stage="5"] .sev-critical .vz-badge circle{stroke:var(--sev-critical)}
.vz-node{cursor:pointer;outline:none}
.vz-node:focus-visible .vz-hit,.vz-node[aria-pressed="true"] .vz-hit{stroke:var(--slate);stroke-width:2;fill:rgba(159,179,200,.08)}
/* stage reveal: elements with data-s above the current stage fade out; edges draw in along their length */
.vz [data-s]{transition:opacity var(--dur) var(--ease)}
.vz .is-later{opacity:0;pointer-events:none}
.vz-edge line{stroke-dashoffset:0;transition:stroke-dashoffset var(--dur-slow) var(--ease)}
.vz-edge.con line{stroke-dasharray:1 1}
.vz-edge.is-later line{stroke-dashoffset:1}
.vz-legend{display:flex;flex-wrap:wrap;gap:var(--space-2xs) var(--space-s);font-family:var(--font-mono);font-size:var(--step--2);color:var(--muted);padding:var(--space-2xs) var(--space-3xs) 0}
.vz-legend .lg{display:inline-block;width:1.6em;height:0;vertical-align:middle;margin-right:.4em;border-top:2px solid var(--ink)}
.vz-legend .lg.asg{border-top:2px dashed var(--muted)}
.vz-legend .lg.crit{width:.9em;height:.9em;border:2px solid var(--sev-critical);border-radius:50%}
.vz-legend .lg.med{width:.9em;height:.9em;border:2px dashed var(--muted);border-radius:50%}
.vz-side{display:flex;flex-direction:column;gap:var(--space-xs)}
.vz-capts{min-height:4.6em}
.vz-capt{margin:0;font-size:var(--step--1);color:var(--ink)}
.vz-verdict{display:flex;align-items:baseline;gap:var(--space-xs);font-family:var(--font-mono);font-size:var(--step--1);color:var(--muted);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:var(--space-2xs) 0}
.vz-v{font-size:var(--step-1);color:var(--ink);letter-spacing:.12em;font-weight:700}
.vz-verdict b.c{color:var(--sev-critical)}
.vz-detail{margin:0;font-size:var(--step--1);color:var(--muted);min-height:2.6em}
.vz-detail strong{color:var(--ink)}
.vz-findings{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.vz-f{display:grid;grid-template-columns:auto auto 1fr;gap:0 var(--space-2xs);align-items:baseline;width:100%;min-height:var(--target);text-align:left;font:inherit;font-size:var(--step--1);color:var(--ink);background:transparent;border:0;border-left:2px solid transparent;padding:var(--space-3xs) var(--space-2xs);cursor:pointer}
.vz-f:hover{background:var(--surface)}
.vz-f[aria-pressed="true"]{background:var(--surface);border-left-color:var(--slate)}
.vz-f code{font-size:var(--step--2)}
.vz-f-l{font-family:var(--font-mono);font-size:var(--step--2);color:var(--muted);justify-self:end}
.vz-f-d{grid-column:1/-1;color:var(--muted);font-size:var(--step--2);line-height:1.45}
.vz-src{margin:var(--space-s) 0 0;background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);padding:var(--space-xs) 0;overflow-x:auto;font-size:var(--step--1);line-height:1.6}
.vz-ln{display:block;padding:0 var(--space-s) 0 0;border-left:2px solid transparent;white-space:pre}
.vz-lno{display:inline-block;width:3.2em;padding-right:1em;text-align:right;color:var(--muted);opacity:.7;user-select:none}
.vz-ln.has-f .vz-lno{opacity:1}
.vz-ln.has-f .vz-lno::before{content:"\25CF";font-size:.6em;margin-right:.6em;vertical-align:.2em;color:var(--muted)}
.vz-ln.is-sel{background:rgba(159,179,200,.08);border-left-color:var(--slate)}
.vz-findings .is-later{display:none}
.vz,.vz-grid>*,.vz-fig{min-width:0;max-width:100%}
@media (max-width:600px){.vz-name{font-size:17px}.vz-edge text{font-size:14px}.vz-tpl-l{font-size:15px}.vz-crit-l{font-size:14px}}

/* ---- Register map: forms and booking set in Ratio Booking (glyph-engine docs/STYLE_GUIDE.md §2) ---- */
.cform input,.cform textarea,.cform select{font-family:var(--font-form)}
.cform .btn{font-family:var(--font-ui);font-weight:400}   /* every CTA, the submit included, is Ratio Button Regular (style guide §2a) */
