/* Shared across all pages (13 Oct 2026): inline lead forms, sticky contact bar, reveal fade. Uses each page's colour tokens. */
.leadmini,.leadstep{margin:32px 0 0;padding:20px 22px;border:1px solid var(--acc);border-radius:var(--r,10px);background:var(--tint);scroll-margin-top:80px}
.leadmini .lm-h,.leadstep .lm-h{font:700 clamp(20px,2.4vw,24px)/1.2 var(--disp);color:var(--ink);margin:0}
.leadmini .lm-sub,.leadstep .lm-sub{color:var(--ink2);margin:6px 0 0;font-size:15px}
.leadmini form,.leadstep form{display:grid;gap:12px;margin-top:14px}
.lm-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.leadmini label,.leadstep label{display:block;font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);margin-bottom:4px}
.leadmini input,.leadmini textarea,.leadstep input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:2px;background:var(--paper);color:var(--ink);font:16px var(--sans)}
.leadmini textarea{resize:vertical;min-height:84px}
.leadmini ::placeholder,.leadstep ::placeholder{color:var(--ink2);opacity:.85}
.leadmini input:focus,.leadmini textarea:focus,.leadstep input:focus{outline:2px solid var(--acc);outline-offset:1px}
.leadmini [aria-invalid="true"],.leadstep [aria-invalid="true"]{border-color:var(--warn)}
.lm-help{font-size:13px;color:var(--ink2);margin:4px 0 0}
.lm-err{font-size:13px;color:var(--warn);margin:4px 0 0;min-height:0}.lm-err:empty{display:none}
.leadmini button,.leadstep button{justify-self:start;border:0;cursor:pointer;font:600 16px var(--sans)}
.leadmini button:disabled,.leadstep button:disabled{opacity:.6;cursor:wait}
.lm-ok{background:var(--paper);border:1px solid var(--acc);border-radius:2px;padding:12px 14px;margin-top:14px;font-size:15px}.lm-ok[hidden]{display:none}
.leadmini.sent form,.leadstep.sent form{display:none}
.lm-alt,.lm-proof{font-size:13px;color:var(--ink2);margin:12px 0 0}
.lm-phone{margin:12px 0 0;font-size:15px}.lm-phone a{color:var(--acc);font-weight:500}
.steps2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}.steps2>*{margin:0}
@media (max-width:760px){.lm-row,.steps2{grid-template-columns:1fr}.leadmini,.leadstep{padding:16px}.lm-phone a,.lm-alt a,.lm-proof a{display:inline-block;padding:8px 0}}
/* sticky contact bar (phones) */
.sticky{display:none}
@media (max-width:760px){.sticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--paper);border-top:1px solid var(--line);padding:8px 12px;gap:8px}.sticky a{flex:1;text-align:center;padding:12px 6px;font:600 14px var(--sans);color:var(--acc);text-decoration:none;border:1px solid var(--acc);border-radius:2px}.sticky a:first-child{background:var(--acc);color:var(--acc-ink)}body{padding-bottom:72px}html{scroll-padding-bottom:80px}}
html{scroll-padding-top:84px}
@media print{.sticky,.leadmini,.leadstep{display:none!important}}

/* Shared visual components (13 Oct 2026). Tokens fall back so guide pages without the homepage's chassis tokens still render. */
.desk{margin:24px 0;background:var(--paper);border:1px solid var(--line);border-radius:var(--r,10px);box-shadow:var(--sh);overflow:hidden;font-size:14px;max-width:560px}
.dk-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 16px;background:var(--chassis,var(--ink));color:var(--chassis-ink,var(--bg));font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase}
.dk-on{white-space:nowrap;opacity:.8}.dk-on::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acc2,var(--acc));margin-right:6px}
.desk .k{display:block;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-bottom:6px}
.dk-sec{padding:14px 16px;border-bottom:1px solid var(--line)}
.dk-req p{font:15px/1.45 var(--mono);color:var(--ink)}
.dk-lines{width:100%;font-size:14px;border-collapse:collapse}.dk-lines td{padding:5px 0;border-bottom:1px dashed var(--line)}.dk-lines td.n{text-align:right;white-space:nowrap;padding-left:12px}.dk-lines tr.t td{border:0;font-weight:700;font-size:16px;padding-top:10px}
.dk-src ul{list-style:none;padding:0;margin:0;font:12.5px/1.5 var(--mono);color:var(--ink)}.dk-src li{margin:3px 0}.dk-src li::before{content:"\21B3  ";color:var(--acc)}
.dk-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px;padding:12px 16px;background:var(--tint);font:500 12px var(--mono);color:var(--ink2)}
.dk-next{color:var(--acc);font-weight:600}
.desk figcaption{padding:10px 16px;font-size:12.5px;color:var(--ink2);border-top:1px solid var(--line)}.desk figcaption a{overflow-wrap:anywhere}

.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:22px 0}
.stat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r,10px);box-shadow:var(--sh);padding:16px 18px}
.stat b{display:block;font:800 clamp(28px,4vw,40px)/1 var(--disp);letter-spacing:-.02em;color:var(--ink)}
.stat span{display:block;margin-top:8px;font-size:13.5px;color:var(--ink2)}
.stat small{display:block;margin-top:6px;font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--acc)}

figure.diagram{margin:26px 0;background:var(--paper);border:1px solid var(--line);border-radius:var(--r,10px);box-shadow:var(--sh);padding:18px}
figure.diagram svg{display:block;width:100%;height:auto;color:var(--ink)}
figure.diagram figcaption{margin-top:10px;font-size:13px;color:var(--ink2)}

/* Comparison tables become stacked cards on phones. Mark the table class="cmp-cards" and give each td data-label="<column header>". */
@media (max-width:600px){
 table.cmp-cards thead{position:absolute;left:-9999px}
 table.cmp-cards,table.cmp-cards tbody,table.cmp-cards tr,table.cmp-cards td{display:block;width:100%}
 table.cmp-cards{min-width:0!important}
 table.cmp-cards tr{background:var(--paper);border:1px solid var(--line);border-radius:var(--r,10px);margin:0 0 12px;padding:6px 0}
 table.cmp-cards td{border:0;padding:6px 14px}
 table.cmp-cards td:first-child{font-weight:700;position:static}
 table.cmp-cards td[data-label]:not(:first-child)::before{content:attr(data-label);display:block;font:500 10.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-bottom:2px}
}

/* Status box: short version visible, details on demand. */
details.status{margin-top:18px;background:var(--tint);border:1px solid var(--acc);border-radius:var(--r,10px);padding:12px 16px;font-size:14px}
details.status summary{cursor:pointer;font-weight:600;list-style:none}details.status summary::-webkit-details-marker{display:none}
details.status summary::after{content:" · details";font:500 12px var(--mono);color:var(--acc)}details.status[open] summary::after{content:""}
details.status p{margin-top:8px;color:var(--ink2)}

/* Answer-first box (Minto): the answer in one or two sentences under the H1. */
.answer{margin:22px 0 0;padding:16px 18px;border-left:4px solid var(--acc);background:var(--paper);border-radius:0 var(--r,10px) var(--r,10px) 0;box-shadow:var(--sh);font-size:17px;max-width:44em}
.answer b{font-family:var(--disp)}

/* CV2 13 Oct 2026: error box, privacy note, step-2 disclosure */
.lm-alert{background:var(--paper);border:1px solid var(--warn);border-radius:2px;padding:12px 14px;margin-top:14px;font-size:15px}
.lm-alert[hidden]{display:none}
.lm-alert .lm-fb{user-select:all;font-weight:600}
.lm-alert button{margin-left:8px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:13px var(--sans);padding:4px 8px;cursor:pointer}
.lm-privacy{font-size:12px;color:var(--ink2);margin:0}
.lm-privacy a{color:var(--acc)}
.step2{margin-top:32px}.step2>summary{cursor:pointer;font-weight:600;padding:8px 0}.step2 .leadstep{margin-top:8px}

/* 14 Oct 2026: on phones, figures use the full text column so SVG text stays >=11px at 343px. */
@media (max-width:480px){main figure.diagram{padding-left:0;padding-right:0;border-left:0;border-right:0;border-radius:0;background:none}}
/* standard nav + mobile menu (14 Oct 2026): links sit in .navlinks; under 760px a Menu button toggles them as a panel (lead.js) */
.navlinks{display:contents}.navmenu{display:none}
.topnav{display:contents}
@media (max-width:760px){
 .navmenu{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;margin-left:8px;font:600 14px var(--sans);color:var(--ink);background:none;border:1px solid var(--line);border-radius:2px;cursor:pointer;order:5}
 .navmenu:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
 .navmenu[aria-expanded="true"]{border-color:var(--acc);color:var(--acc)}
 .navlinks{display:none!important}
 .navopen{flex-wrap:wrap!important}
 .navopen .navlinks{display:flex!important;flex-direction:column;order:9;flex-basis:100%;width:100%;padding:4px 0 10px;border-top:1px solid var(--line)}
 .navopen .navlinks a{display:block!important;padding:12px 4px!important;min-height:44px;color:var(--ink);text-decoration:none;font:500 15px var(--sans)}
}
@media (max-width:820px) and (min-width:761px){header.top .navmenu{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font:600 14px var(--sans);color:var(--ink);background:none;border:1px solid var(--line);border-radius:2px;cursor:pointer}header.top .navlinks{display:none!important}header.top.navopen{flex-wrap:wrap!important}header.top.navopen .navlinks{display:flex!important;flex-direction:column;order:9;flex-basis:100%;padding:4px 0 10px;border-top:1px solid var(--line)}header.top.navopen .navlinks a{display:block!important;padding:12px 4px}}
header.top a.navcta{font:600 14px var(--sans);text-decoration:none;padding:8px 14px;border-radius:8px;background:var(--acc);color:var(--acc-ink)}
@media (max-width:480px){.navcta{display:none!important}}/* phones: the sticky bar carries the same primary CTA */