/* /capabilities (Joe, 2026-10-16: "make sure these are stated on the site ... organized cleanly and available knowledge"): every
   piece NexVerto builds and runs, in five groups, in the site's own type (Geist headings, IBM Plex Sans text) and tokens (premium.css).
   The page arrives with the first group open (.cap.is-live in the markup), so nothing moves at load. Phones and tablets: one tile
   per group; a tap opens it in place, one at a time, and the tapped title stays where the finger is (capabilities.js). Desktop: the
   five titles are tabs beside one panel; every panel shares the panel's cell, so switching never moves the page.
   Motion, only after a tap (nothing moves at load): the opened group's items rise 8 px and fade in, 280 ms ease-out, 40 ms apart;
   on phones the chevron turns in 250 ms; desktop tabs switch at once. Reduced motion: shown at once, nothing moves. This page loads before premium.css, so every rule is scoped to body.p-capabilities. */
a {text-decoration:none!important;}

body.p-capabilities .cap-hero {grid-template-columns:minmax(0,1fr);padding-bottom:56px;}
body.p-capabilities .cap-hero h1 {max-width:16ch;}
body.p-capabilities .cap-hero .p-lede {max-width:46ch;}
body.p-capabilities .cap-sec {padding-top:0;}
body.p-capabilities .cap {display:grid;gap:12px;overflow-anchor:none;}
body.p-capabilities .cap-group {border:1px solid var(--border);border-radius:16px;background:var(--surface);}
@media (max-width:1100px) {body.p-capabilities .cap.is-ready .cap-group {transition:border-color .25s ease-out;}}
body.p-capabilities .cap-group.is-open {border-color:color-mix(in srgb,var(--accent) 50%,var(--border));}
body.p-capabilities .cap-h {font-size:inherit;}
body.p-capabilities .cap-tab {all:unset;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:16px;align-items:center;width:100%;
  min-height:76px;padding:16px 18px;border-radius:16px;cursor:pointer;-webkit-tap-highlight-color:transparent;}
body.p-capabilities .cap-title {grid-column:1;font:500 21px/1.2 var(--serif);letter-spacing:-.02em;color:var(--ink);}
body.p-capabilities .cap-sum {grid-column:1;margin-top:4px;font:400 15px/1.45 var(--sans);color:var(--ink-muted);text-wrap:pretty;}
body.p-capabilities .cap-tab .ico {grid-column:2;grid-row:1 / span 2;width:20px;height:20px;stroke:var(--accent);stroke-width:2.2;}
@media (max-width:1100px) {body.p-capabilities .cap.is-ready .cap-tab .ico {transition:transform .25s cubic-bezier(.2,.7,.2,1);}}
body.p-capabilities .cap-tab[aria-expanded=true] .ico {transform:rotate(180deg);}
body.p-capabilities .cap-tab:focus-visible {outline:3px solid var(--accent);outline-offset:-3px;}
body.p-capabilities .cap-tab:active .cap-title {opacity:.8;}
body.p-capabilities .cap-list {margin:0;padding:0 18px 6px;list-style:none;}
body.p-capabilities .cap-list li {padding:14px 0 16px;border-top:1px solid var(--border);}
body.p-capabilities .cap-name {margin:0;font:500 17px/1.3 var(--serif);letter-spacing:-.01em;color:var(--ink);}
body.p-capabilities .cap-list p {margin-top:4px;font-size:16px;line-height:1.5;color:var(--ink-muted);text-wrap:pretty;}
body.p-capabilities .cap-soon {display:inline-block;margin-left:6px;padding:3px 9px;border-radius:999px;background:var(--surface-3);color:var(--accent);
  font:600 12px/1.3 var(--sans);letter-spacing:.02em;vertical-align:2px;white-space:nowrap;}
body.p-capabilities .cap.is-live .cap-panel:not(.is-open) {display:none;}
body.p-capabilities .cap.is-live .cap-panel.is-open.is-enter li {animation:cap-in .28s cubic-bezier(.2,.7,.2,1) both;}
body.p-capabilities .cap.is-live .cap-panel.is-open.is-enter li:nth-child(2) {animation-delay:40ms;}
body.p-capabilities .cap.is-live .cap-panel.is-open.is-enter li:nth-child(3) {animation-delay:80ms;}
body.p-capabilities .cap.is-live .cap-panel.is-open.is-enter li:nth-child(4) {animation-delay:120ms;}
body.p-capabilities .cap.is-live .cap-panel.is-open.is-enter li:nth-child(5) {animation-delay:160ms;}
body.p-capabilities .cap.is-live .cap-panel.is-open.is-enter li:nth-child(6) {animation-delay:200ms;}
@keyframes cap-in {from {opacity:0;transform:translateY(8px);} to {opacity:1;transform:none;}}
@media (hover:hover) and (pointer:fine) {body.p-capabilities .cap-tab:hover .cap-title {color:var(--accent);}}

/* The closing call to action: one line and one button. */
body.p-capabilities .cap-end-in {display:grid;gap:24px;padding-top:40px;border-top:1px solid var(--border);}
body.p-capabilities .cap-end h2 {font:500 clamp(28px,3vw,40px)/1.12 var(--serif);letter-spacing:-.025em;max-width:22ch;}
body.p-capabilities .cap-end p {margin-top:12px;font-size:18px;max-width:46ch;}
body.p-capabilities .cap-end .btn {justify-self:start;}

@media (min-width:1101px) {
  body.p-capabilities .cap-list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 40px;padding:0 24px 16px;}
  body.p-capabilities .cap-list li {padding:20px 0 18px;}
  body.p-capabilities .cap.is-live .cap-list li:nth-child(-n+2) {border-top:0;}
  body.p-capabilities .cap-name {font-size:20px;}
  body.p-capabilities .cap.is-live {grid-template-columns:minmax(0,360px) minmax(0,1fr);grid-template-rows:repeat(5,auto) 1fr;gap:8px 40px;align-items:start;}
  body.p-capabilities .cap.is-live .cap-group {display:contents;}
  body.p-capabilities .cap.is-live .cap-h {grid-column:1;}
  body.p-capabilities .cap-tab {border:1px solid transparent;}
  body.p-capabilities .cap.is-live .cap-tab {min-height:88px;padding:18px 22px;border-radius:16px;}
  body.p-capabilities .cap.is-live .cap-tab:hover {background:var(--surface-2);}
  body.p-capabilities .cap.is-live .cap-tab[aria-expanded=true] {background:var(--surface);border-color:var(--border);box-shadow:inset 3px 0 0 var(--accent);}
  body.p-capabilities .cap.is-live .cap-tab .ico {opacity:0;transform:rotate(-90deg);}
  body.p-capabilities .cap.is-live .cap-tab:hover .ico {opacity:.5;}
  body.p-capabilities .cap.is-live .cap-tab[aria-expanded=true] .ico {opacity:1;transform:rotate(-90deg);}
  body.p-capabilities .cap.is-live .cap-panel {grid-column:2;grid-row:1 / -1;align-self:stretch;padding:16px 16px 8px;border:1px solid var(--border);border-radius:24px;
    background:var(--surface);box-shadow:var(--shadow);}
  body.p-capabilities .cap.is-live .cap-panel:not(.is-open) {display:block;visibility:hidden;}
  body.p-capabilities .cap-end-in {grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:48px;padding-top:56px;}
  body.p-capabilities .cap-end .btn {justify-self:end;}
}
@media (prefers-reduced-motion:reduce) {
  body.p-capabilities .cap.is-live .cap-panel.is-open.is-enter li {animation:none;}
  body.p-capabilities .cap.is-ready .cap-tab .ico, body.p-capabilities .cap.is-ready .cap-tab, body.p-capabilities .cap.is-ready .cap-group {transition:none;}
}