/* Viz card styles in the Signal grammar of the ecosystem build-out (2026-10-29). Colours, radii and the type family
   come from tokens.css (emitted by build.py from marketing-2030/design/tokens.json); no hex is written here. */
.viz,.vbadgehost{--amber:var(--t-amber);--blue:var(--t-blue2);--lit:var(--t-blue-lit);--ink:var(--t-text-white);--dim:var(--t-text-secondary);--faint:var(--t-text-muted);--glass:var(--t-card-glass);--line:var(--t-border);--line-strong:var(--t-border-strong);--sans:var(--t-sans)}
/* ---- inserted graphic cards (the viz library) ---- */
.viz{margin:16px 0 18px;animation:vrise .42s ease}
/* lean small-caps label: Avenir Medium, .12em tracking, Blue2 */
.vlbl{font:500 10px/1.5 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:10px}
.vlbl .slash{font-weight:300;color:var(--blue)}
.vlbl-hint{font-weight:300;color:var(--faint);text-transform:none;letter-spacing:.02em}
.vgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
/* glass card: white 3 percent fill, 1px lit-blue 35 percent border, radius 16 */
.vcell{background:var(--glass);border:1px solid var(--line);border-radius:var(--t-radius-card);padding:16px 18px 14px;position:relative}
.vcell[data-ask]{cursor:pointer;transition:border-color .16s,background .16s,transform .1s,box-shadow .3s}
.vcell[data-ask]:hover{border-color:var(--line-strong);background:rgba(157,192,240,.06);box-shadow:0 0 24px rgba(115,155,207,.12)}
.vcell[data-ask]:active{transform:translateY(1px)}
.vcell[data-ask]:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* product mark: the ONE mark style (Rob 2026-11-01), Light 300 white, the Blue2 weight-300 slash attached; feature / tier forms
   in Title case at the same weight; eyebrow above where the cell is not an /ARQ form (/MARKET, its own product) */
.vcell .lk{font:300 16px/1.2 var(--sans);letter-spacing:0;color:var(--ink)}
.vcell .lk .slash{font-weight:300;color:var(--blue)}
.vcell .lk .lk-f{font-weight:300}
.vcell .lk .lk-eb{display:block;font:500 8.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:3px}
.vcell .d{font:300 13px/1.45 var(--sans);color:var(--dim);margin-top:7px}
.vcell .vgo{font:500 9.5px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--lit);margin-top:10px;display:inline-block;opacity:0;transform:translateX(-3px);transition:opacity .16s,transform .16s}
.vcell[data-ask]:hover .vgo,.vcell[data-ask]:focus-visible .vgo{opacity:1;transform:translateX(0)}
/* a drawn sheet inside an answer */
.viz .vsheet{margin:0}.viz .vsheet svg{width:100%;height:auto;display:block}
/* stat cards */
.vstats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.vstat{background:var(--glass);border:1px solid var(--line);border-radius:var(--t-radius-card);padding:18px 10px 14px;text-align:center}
.vstat .n{font:700 26px/1.05 var(--sans);letter-spacing:-.02em;color:var(--ink)}
.vstat .l{font:500 8.5px/1.35 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-top:8px}
/* pills */
.vchips{display:flex;flex-wrap:wrap;gap:8px}
.vchip{font:500 10px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);border:1px solid var(--line);border-radius:var(--t-radius-pill);padding:8px 13px;background:rgba(115,155,207,.08)}
/* stale-page notice: shown when an answer references a viz this cached page lacks */
.vstale{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:9px;padding:11px 13px;border:1px solid var(--line);border-radius:var(--t-radius-panel);background:rgba(115,155,207,.08);font:300 14px/1.5 var(--sans);color:var(--dim)}
.vstale-b{font:500 9px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;padding:7px 12px;border-radius:var(--t-radius-pill);border:1px solid var(--blue);background:rgba(115,155,207,.16);color:var(--ink);cursor:pointer}
.vstale-b:hover{background:rgba(115,155,207,.3)}
/* UK memberships and accreditations: the badges are supplied on light backgrounds, so each sits on a light tile */
.vbadges{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:10px}
.vbadge{display:flex;gap:13px;align-items:flex-start;background:var(--glass);border:1px solid var(--line);border-radius:var(--t-radius-card);padding:14px 15px}
.vbadge .bimg{flex:none;width:76px;height:56px;border-radius:var(--t-radius-chip);background:#fff;display:flex;align-items:center;justify-content:center;padding:7px;overflow:hidden}
.vbadge .bimg img{max-width:100%;max-height:100%;width:auto;height:auto;display:block;object-fit:contain}
.vbadge .bwide img{max-height:34px}
.vbadge .btxt{min-width:0}
.vbadge .bn{font:700 13.5px/1.25 var(--sans);color:var(--ink)}
.vbadge .bl{font:500 8.5px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-top:3px}
.vbadge .bd{font:300 12.5px/1.5 var(--sans);color:var(--dim);margin-top:6px}
.vbadge-note{font:300 11.5px/1.5 var(--sans);color:var(--faint);margin-top:10px}
/* History of Data slideshow (in-chat deck) */
.vhod{position:relative;margin-top:9px;border:1px solid var(--line);border-radius:var(--t-radius-card);overflow:hidden;background:var(--t-page-dark)}
.vhod-stage{position:relative;width:100%;aspect-ratio:16/9;background:var(--t-page-dark);overflow:hidden}
.vhod-stage img,.vhod-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease}
.vhod-stage img.on,.vhod-stage video.on{opacity:1}
.vhod-scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(9,13,22,.15) 0%,rgba(9,13,22,.55) 55%,rgba(9,13,22,.94) 100%)}
.vhod-cap{position:absolute;left:0;right:0;bottom:0;padding:14px 16px 13px;pointer-events:none}
.vhod-num{font:500 9px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin-bottom:5px}
.vhod-h{font:700 .98rem/1.25 var(--sans);color:var(--ink);margin-bottom:6px}
.vhod-t{font:300 .84rem/1.5 var(--sans);color:var(--dim);max-height:0;overflow:hidden;transition:max-height .35s ease,opacity .3s ease;opacity:0}
.vhod.expanded .vhod-t{max-height:220px;opacity:1}
.vhod-bar{display:flex;align-items:center;gap:10px;padding:9px 12px;border-top:1px solid var(--line);background:rgba(255,255,255,.03)}
.vhod-btn{width:28px;height:28px;flex:none;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--dim);cursor:pointer;font-size:12px;line-height:1;display:flex;align-items:center;justify-content:center;transition:.15s}
.vhod-btn:hover:not(:disabled){color:var(--ink);border-color:var(--blue);background:rgba(115,155,207,.16)}
.vhod-btn:disabled{opacity:.3;cursor:default}
.vhod-dots{display:flex;gap:5px;flex:1;flex-wrap:wrap}
.vhod-dot{width:6px;height:6px;border-radius:50%;border:0;padding:0;cursor:pointer;background:rgba(255,255,255,.22);transition:.18s}
.vhod-dot.active{background:var(--blue);transform:scale(1.45)}
.vhod-more{font:500 9px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);background:none;border:0;cursor:pointer;padding:4px 2px;white-space:nowrap}
.vhod-more:hover{color:var(--ink)}
/* FABRIC mesh viz (the live site's map, framed as a glass panel) */
.vfab{position:relative;margin-top:9px;border:1px solid var(--line);border-radius:var(--t-radius-card);overflow:hidden;background:radial-gradient(ellipse 90% 75% at 50% 46%,rgba(29,58,122,.45) 0%,var(--t-page-dark) 60%)}
.vfab-map{display:block;width:100%;line-height:0}
.vfab-map svg{display:block;width:100%;height:auto}
.vfab-legend{position:absolute;top:12px;left:14px;display:flex;gap:14px;flex-wrap:wrap;font:500 8.5px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);pointer-events:none}
.vfab-legend span{display:flex;align-items:center;gap:6px}
.vfab-legend i{width:15px;height:2px;border-radius:1px;display:inline-block}
/* mission quote: a Blue2 rule, the title as a lean label, the line in Light */
.vquote{position:relative;background:var(--glass);border:1px solid var(--line);border-radius:var(--t-radius-card);padding:20px 24px 20px 28px}
.vquote:before{content:"";position:absolute;left:12px;top:20px;bottom:20px;width:2px;background:var(--blue);border-radius:1px}
.vquote .t{font:500 9.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:9px}
.vquote .q{font:300 1.14rem/1.42 var(--sans);color:var(--ink)}
/* contact card: real clickable actions (mailto / tel / form) */
.vcontact{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.vc-act,.vc-hq{display:flex;align-items:center;gap:12px;background:var(--glass);border:1px solid var(--line);border-radius:var(--t-radius-card);padding:14px 16px;text-decoration:none;transition:.16s}
.vc-act{cursor:pointer}
.vc-act:hover{border-color:var(--line-strong);background:rgba(157,192,240,.06);transform:translateY(-2px)}
.vc-i{width:30px;height:30px;flex-shrink:0;border-radius:var(--t-radius-chip);display:flex;align-items:center;justify-content:center;background:rgba(115,155,207,.12);border:1px solid var(--line);color:var(--lit);font-size:14px}
.vc-k{display:block;font:500 8.5px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.vc-v{display:block;font:500 13.5px/1.35 var(--sans);color:var(--ink);margin-top:2px;word-break:break-word}
.vc-hq{grid-column:1 / -1}
.vc-hq .vc-v{font-weight:500;color:var(--ink)}
/* narrow answer columns (phones): one column, the deck and map at phone scale */
@media(max-width:640px){
.vgrid{grid-template-columns:1fr}.vstats{grid-template-columns:repeat(2,1fr)}.vcontact{grid-template-columns:1fr}
.vbadges{grid-template-columns:1fr;gap:10px}.vbadge .bimg{width:64px;height:48px}
.vhod-h{font-size:.92rem}.vhod-t{font-size:.8rem}.vhod.expanded .vhod-t{max-height:170px}.vhod-dot{width:5px;height:5px}
.vfab-legend{font-size:8px;gap:8px;top:8px;left:9px}.vfab-map svg .fabnode text{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.led,.caret,.tc,.viz{animation:none}}
@keyframes vrise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}