/* ===== ProWarehouse extras: jump-to, sector picker, reviews, timeline, a11y, spacing ===== */

/* --- section bar replaced by the Jump to button --- */
.site-head>.subnav{display:none!important}

.jump{position:fixed;right:24px;bottom:24px;z-index:70;font-family:inherit}
.jump-btn{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 18px 0 14px;border-radius:999px;border:1px solid var(--line,#dfe6ef);background:#fff;color:var(--ink,#0f1e45);font:600 15px/1 inherit;font-family:inherit;box-shadow:0 6px 20px rgba(15,30,69,.16);cursor:pointer;transition:transform .2s,box-shadow .2s}
.jump-btn:hover{box-shadow:0 10px 26px rgba(15,30,69,.22)}
.jump-btn svg{width:18px;height:18px}
.jump-panel{position:absolute;right:0;bottom:58px;width:280px;max-height:min(70vh,520px);overflow:auto;background:#fff;border:1px solid var(--line,#dfe6ef);border-radius:14px;box-shadow:0 24px 60px rgba(15,30,69,.2);padding:10px;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .18s,transform .18s}
.jump.open .jump-panel{opacity:1;transform:none;pointer-events:auto}
.jump-panel p{margin:4px 8px 8px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:#5b6b85}
.jump-panel ol{list-style:none;margin:0;padding:0}
.jump-panel a{display:flex;align-items:center;gap:10px;padding:10px;border-radius:8px;color:var(--ink,#0f1e45);text-decoration:none;font-size:15px;font-weight:500}
.jump-panel a:hover,.jump-panel a:focus-visible{background:#eef6fb}
.jump-panel a.on{background:var(--ink,#0f1e45);color:#fff}
.jump-panel a span{width:22px;height:22px;flex:none;display:grid;place-items:center;border-radius:50%;background:#e3f5fb;font-size:11px;font-weight:600;color:var(--ink,#0f1e45)}
.jump-panel a.on span{background:#27a8e0;color:#0f1e45}
/* desktop: sits above the floating quote button */
@media (min-width:761px){body:has(.float-cta.show) .jump{bottom:92px}}
/* mobile: sits above the sticky call / quote bar */
@media (max-width:760px){.jump{right:12px;bottom:16px}body:has(.m-bar.show) .jump{bottom:84px}.jump-btn{height:42px;font-size:14px}.jump-panel{width:calc(100vw - 24px);max-width:320px}}

/* --- home: sector picker --- */
.picker{padding:40px 0 8px}
.picker .pk{display:flex;align-items:center;gap:24px;flex-wrap:wrap;background:#fff;border:1px solid var(--line,#dfe6ef);border-radius:16px;padding:22px 24px;box-shadow:0 8px 24px rgba(15,30,69,.06)}
.picker h2{font-size:22px;margin:0;flex:0 0 auto}
.picker ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;flex:1}
.picker a{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px;border-radius:999px;border:1px solid var(--line,#dfe6ef);color:var(--ink,#0f1e45);text-decoration:none;font-weight:500;font-size:15px;background:#f6f9fc;transition:background .15s,border-color .15s,color .15s}
.picker a:hover,.picker a:focus-visible{background:var(--ink,#0f1e45);border-color:var(--ink,#0f1e45);color:#fff}
.picker a.other{background:#fff;border-style:dashed}
@media (max-width:760px){.picker{padding:28px 0 0}.picker .pk{padding:18px;gap:14px}.picker h2{font-size:19px}.picker a{height:40px;font-size:14px;padding:0 14px}}

/* --- reviews strip --- */
.revs{padding:28px 0 0}
.revs .rv-in{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.revs figure{margin:0;display:flex;gap:14px;align-items:flex-start;padding:18px 20px;border-radius:14px;background:#f6f9fc;border:1px solid var(--line,#dfe6ef)}
.revs .qmark{color:#DAA15C;font-size:44px;line-height:.9;font-weight:600;flex:none;font-family:Georgia,serif}
.revs blockquote{margin:0;font-size:15px;line-height:1.55;color:var(--ink,#0f1e45)}
.revs figcaption{margin-top:6px;font-size:13px;color:#5b6b85;font-weight:500}
.revs .rv-note{grid-column:1/-1;margin:2px 0 0;font-size:12.5px;color:#5b6b85}
.revs .rv-note a{color:inherit}
@media (max-width:760px){.revs .rv-in{grid-template-columns:1fr}.revs figure{padding:16px}}

/* --- case study results headline --- */
.cs-result{display:flex;align-items:center;gap:14px;margin:0 0 28px;padding:18px 22px;border-radius:14px;background:var(--ink,#0f1e45);color:#fff}
.cs-result .k{flex:none;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:#7fd3f3}
.cs-result strong{font-size:clamp(19px,2.2vw,26px);line-height:1.25;font-weight:600}
@media (max-width:760px){.cs-result{flex-direction:column;align-items:flex-start;gap:6px;padding:16px 18px}}

/* --- quote page: what happens next --- */
.next-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:0;counter-reset:ns}
.next-steps li{position:relative;padding:0 0 22px 52px}
.next-steps li:last-child{padding-bottom:0}
.next-steps li:before{counter-increment:ns;content:counter(ns);position:absolute;left:0;top:0;width:34px;height:34px;border-radius:50%;background:var(--ink,#0f1e45);color:#fff;display:grid;place-items:center;font-weight:600;font-size:14px}
.next-steps li:not(:last-child):after{content:"";position:absolute;left:16px;top:38px;bottom:4px;width:2px;background:#cfe3ef}
.next-steps strong{display:block;font-size:17px;color:var(--ink,#0f1e45)}
.next-steps em{font-style:normal;font-size:13px;font-weight:600;color:#0b6f9c}
.next-steps p{margin:4px 0 0;font-size:15px;color:#4a5a73}

/* --- accessibility --- */
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--ink,#0f1e45);color:#fff;padding:10px 16px;border-radius:8px;font-weight:600;text-decoration:none}
.skip:focus{top:12px}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #27a8e0;outline-offset:2px}
.eyebrow{color:#0b6f9c}
.accred2 .eyebrow,.tst2 .eyebrow,.q3 .eyebrow,.site-foot .eyebrow,[class*=navy] .eyebrow{color:#7fd3f3}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* --- spacing: one scale --- */
:root{--sec:80px}
@media (max-width:760px){
  :root{--sec:48px}
  section.sec{padding-top:48px!important;padding-bottom:48px!important}
  section.sec#services{padding-bottom:48px!important}
  section.sec .sec-head{margin-bottom:24px}
  .tst2,.accred2{padding-top:52px!important;padding-bottom:52px!important}
  .q3{padding-top:52px!important}
}

.jump{transition:opacity .2s,transform .2s}
.jump.away{opacity:0;transform:translateY(10px);pointer-events:none}
.picker h2{max-width:220px;line-height:1.25}
.picker a{height:40px;padding:0 15px;font-size:14.5px}
.f3-brand>.btn{margin-top:28px}
@media (max-width:760px){.f3-brand>.btn{margin-top:28px}.f3-logo{display:inline-block;margin-bottom:6px}.f3-blurb{margin-bottom:22px}}

/* --- images: let CSS aspect ratios win over the width/height attributes (kept for layout stability) --- */
:where(img[width][height]){height:auto;max-width:100%}

/* --- motion extras --- */
.picker a svg{transition:transform .2s}
.picker a:hover svg{transform:translateX(3px)}
.why{transition:transform .25s var(--ease,ease),box-shadow .25s}
.why:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(15,30,69,.10)}
.why>img{transition:filter .4s}
.why:hover>img{filter:saturate(1.08) brightness(1.03)}
.jump{animation:jumpIn .5s .8s both cubic-bezier(.2,.8,.2,1)}
@keyframes jumpIn{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}
.jump.away{animation:none}
.next-steps li:not(:last-child):after{transform-origin:top;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
html.motion .next-steps:not(.drawn) li:after{transform:scaleY(0)}
html.motion .next-steps li:before{transition:transform .4s cubic-bezier(.3,1.5,.5,1),background .3s}
html.motion .next-steps:not(.drawn) li:before{transform:scale(.4)}
.next-steps.drawn li:nth-child(2):before,.next-steps.drawn li:nth-child(2):after{transition-delay:.15s}
.next-steps.drawn li:nth-child(3):before,.next-steps.drawn li:nth-child(3):after{transition-delay:.3s}
.next-steps.drawn li:nth-child(4):before{transition-delay:.45s}
.cs-result{position:relative;overflow:hidden}
.cs-result:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(127,211,243,.18) 50%,transparent 70%);transform:translateX(-100%)}
.cs-result.shine:after{animation:shine 1.4s .3s ease-out}
@keyframes shine{to{transform:translateX(100%)}}
.pg-price{transition:color .3s}
.pg-price.bump{animation:bump .35s ease-out}
@keyframes bump{40%{transform:scale(1.04);color:#7fd3f3}}
@media (prefers-reduced-motion:reduce){.jump{animation:none}}

/* --- mobile: comparison tables become stacked cards instead of sideways scrolling --- */
@media (max-width:640px){
  .tbl-wrap.stack{overflow:visible;border:0;background:none;box-shadow:none}
  .tbl-wrap.stack table,.tbl-wrap.stack tbody,.tbl-wrap.stack tr,.tbl-wrap.stack th,.tbl-wrap.stack td{display:block;width:auto;min-width:0}
  .tbl-wrap.stack table{min-width:0!important}
  .tbl-wrap.stack thead{display:none}
  .tbl-wrap.stack tr{background:#fff;border:1px solid var(--line,#dfe6ef);border-radius:12px;padding:14px 16px;margin-bottom:12px}
  .tbl-wrap.stack tbody th{padding:0 0 8px;font-size:16px;border:0;background:none;color:var(--ink,#0f1e45)}
  .tbl-wrap.stack td{padding:6px 0;border:0;font-size:14.5px}
  .tbl-wrap.stack td:before{content:attr(data-label);display:block;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:#5b6b85;margin-bottom:2px}
}

/* --- film play button --- */
.vwrap{position:relative;display:block}
.vwrap>video{display:block;width:100%}
.vplay{position:absolute;inset:0;margin:auto;width:84px;height:84px;border-radius:50%;border:0;background:rgba(255,255,255,.95);color:var(--ink,#0f1e45);display:grid;place-items:center;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.25);transition:transform .2s,opacity .25s}
.vplay svg{width:30px;height:30px;margin-left:4px}
.vplay:before{content:"";position:absolute;inset:-10px;border-radius:50%;border:2px solid rgba(255,255,255,.7);animation:vpulse 2s ease-out infinite}
.vplay:hover{transform:scale(1.07)}
.vwrap.playing .vplay{opacity:0;pointer-events:none}
@keyframes vpulse{from{transform:scale(.9);opacity:1}to{transform:scale(1.35);opacity:0}}
@media (max-width:760px){.vplay{width:64px;height:64px}.vplay svg{width:24px;height:24px}}
@media (prefers-reduced-motion:reduce){.vplay:before{animation:none}}