/* =====================================================================
   Pipeline continuum (Nov 2026): how the solutions work together.
   ===================================================================== */
.pf-tabs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:30px}
.pf-tabs-l{font-size:13px;font-weight:600;color:var(--ink2);margin-right:4px}
.pf-tabs button{border:1px solid var(--hair);background:var(--card);color:var(--ink);padding:8px 15px;border-radius:999px;font:inherit;font-size:14px;cursor:pointer;transition:background .2s,color .2s}
.pf-tabs button:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--hair))}
.pf-tabs button[aria-selected=true]{background:var(--btnbg);color:var(--btnfg);border-color:transparent}
.pf-flow{list-style:none;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:16px;position:relative}
.pf-flow::before{content:"";position:absolute;left:22px;right:calc((100% - (var(--n) - 1) * 16px) / var(--n) - 22px);top:21px;height:2px;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 22%,transparent));z-index:0}
.pf-step{position:relative;z-index:1;display:flex;flex-direction:column;gap:14px}
.pf-n{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;color:#fff;background:var(--grad);box-shadow:0 0 0 6px var(--pf-ring,var(--surface)),0 8px 18px -6px rgba(30,64,175,.5)}
.pf-card{flex:1;display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:18px;background:var(--card);border:1px solid var(--hair);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.pf-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 40%,var(--hair));box-shadow:0 18px 40px -18px rgba(30,64,175,.3)}
.pf-stage{font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--accent)}
.pf-promise{font-size:19px;font-weight:700;letter-spacing:-.015em;line-height:1.2;color:var(--ink)}
.pf-card p{font-size:14.5px;color:var(--ink2);line-height:1.45;margin-top:2px}
.pf-sols{margin-top:auto;padding-top:10px;display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--hair)}
.pf-sols a{display:inline-flex;gap:7px;align-items:center;font-weight:600;font-size:14.5px;color:var(--accent)}
.pf-sols a:hover{text-decoration:underline}
.pf-sols svg{width:16px;height:16px;flex:none}
.pf-loop{display:flex;gap:10px;align-items:center;margin-top:22px;font-size:15px;color:var(--ink2)}
.pf-loop svg{width:20px;height:20px;flex:none;color:var(--accent)}
.sec:not(.wash):not(.alt) .pf{--pf-ring:var(--bg)}
@media(max-width:980px){
  .pf-flow{grid-template-columns:1fr;gap:14px}
  .pf-flow::before{left:21px;right:auto;top:22px;bottom:22px;width:2px;height:auto;background:linear-gradient(180deg,var(--accent),color-mix(in srgb,var(--accent) 22%,transparent))}
  .pf-step{flex-direction:row;gap:14px;align-items:flex-start}
  .pf-n{flex:none}
  .pf-tabs{flex-wrap:nowrap;overflow-x:auto;margin-left:-20px;margin-right:-20px;padding:0 20px 4px;scrollbar-width:none}
  .pf-tabs::-webkit-scrollbar{display:none}
  .pf-tabs button{flex:none}
}

/* where one solution sits (solution pages) */
.ps-band{padding:28px 0;border-bottom:1px solid var(--hair)}
.ps-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.ps-head h3{font-size:18px;margin:0}
.ps-head p{font-size:14.5px;color:var(--ink2)}
.ps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border:1px solid var(--hair);border-radius:16px;overflow:hidden;background:var(--card)}
.ps-step{position:relative;padding:14px 16px 14px 18px;border-right:1px solid var(--hair);display:flex;flex-direction:column;gap:3px;font-size:14.5px;line-height:1.3}
.ps-step:last-child{border-right:0}
.ps-label{font-size:11.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--ink2);margin-bottom:2px}
.ps-step a{color:var(--ink);font-weight:500}
.ps-step a:hover{color:var(--accent)}
.ps-step.on{background:var(--grad);color:#fff;border-color:transparent}
.ps-step.on .ps-label{color:rgba(255,255,255,.8)}
.ps-step.on a{color:rgba(255,255,255,.9)}
.ps-step.on b{font-weight:700}
@media(max-width:760px){
  .ps{grid-template-columns:repeat(5,minmax(140px,1fr));overflow-x:auto;scrollbar-width:none}
  .ps::-webkit-scrollbar{display:none}
}

/* =====================================================================
   Homepage hero (Nov 2026, option 5): live pipeline + why buyers wait.
   ===================================================================== */
.hero-grid.hx-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:48px}
.hx-card{background:var(--card);border:1px solid var(--hair);border-radius:24px;box-shadow:0 30px 70px -24px rgba(30,64,175,.32);padding:22px 24px;display:flex;flex-direction:column;gap:16px;max-width:580px;margin-left:auto;width:100%;box-sizing:border-box}
.hx-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.hx-live{display:flex;align-items:center;gap:9px;font-weight:700;font-size:15px}
.hx-dot{width:9px;height:9px;border-radius:50%;background:#22C55E;animation:hxp 2s infinite}
.hx-tag{font-size:12px;color:var(--ink2);background:var(--surface);padding:4px 10px;border-radius:999px;white-space:nowrap}
.hx-track{position:relative;padding:0 2px}
.hx-line{position:absolute;left:10%;right:10%;top:18px;height:3px;background:linear-gradient(90deg,var(--accent),#8FB6FF);border-radius:3px}
.hx-bead{position:absolute;top:-4px;width:10px;height:10px;border-radius:50%;background:#2C5BE0;animation:hxflow 6s linear infinite}
.hx-bead:nth-child(2){animation-delay:1.5s}.hx-bead:nth-child(3){animation-delay:3s}.hx-bead:nth-child(4){animation-delay:4.5s}
.hx-stages{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;list-style:none;margin:0;padding:0}
.hx-st{display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center}
.hx-n{width:38px;height:38px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;box-shadow:0 0 0 5px var(--card);box-sizing:border-box}
.hx-st.on .hx-n{background:var(--card);color:var(--accent);border:2px solid var(--accent);box-shadow:0 0 0 5px var(--card),0 0 0 8px rgba(30,64,175,.18)}
.hx-st b{font-size:13px}
.hx-st.on b{color:var(--accent)}
.hx-st small{font-size:11.5px;color:var(--ink2);line-height:1.2}
.hx-why{background:var(--surface);border-radius:18px;padding:16px 18px;display:flex;flex-direction:column;gap:11px}
.hx-why-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.hx-why-h b{font-size:18px;letter-spacing:-.01em}
.hx-why-h span{font-size:12px;color:var(--ink2)}
.hx-bars{display:flex;flex-direction:column;gap:8px;list-style:none;margin:0;padding:0}
.hx-bar{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr) 28px;gap:12px;align-items:center;font-size:13.5px}
.hx-bar i{height:9px;border-radius:99px;background:var(--hair);overflow:hidden;display:block}
.hx-bar i em{display:block;height:100%;background:var(--grad);border-radius:99px}
.hx-bar b{text-align:right}
.hx-quote{display:flex;gap:12px;align-items:flex-start;padding:11px 14px;background:var(--card);border-radius:14px;font-size:13.5px;line-height:1.4}
.hx-quote q{font-style:italic;display:block;margin-top:2px}
.hx-av{flex:none;width:32px;height:32px;border-radius:50%;background:var(--chipbg);color:var(--accent);font-weight:700;font-size:12.5px;display:flex;align-items:center;justify-content:center}
.hx-feed{display:grid;grid-template-columns:44px 104px minmax(0,1fr);gap:10px;font-size:13.5px;padding:0 4px;align-items:start}
.hx-feed .t{color:var(--ink2);font-size:12.5px}
.hx-feed b{color:var(--accent);font-size:13px}
.hx-card .btn{align-self:flex-start}
@keyframes hxflow{0%{left:-2%;opacity:0}8%{opacity:1}92%{opacity:1}100%{left:100%;opacity:0}}
@keyframes hxp{0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}70%{box-shadow:0 0 0 7px rgba(34,197,94,0)}}
@media(prefers-reduced-motion:reduce){.hx-bead,.hx-dot{animation:none}.hx-bead{display:none}}
@media(max-width:900px){.hero-grid.hx-grid{grid-template-columns:1fr;gap:32px}.hx-card{margin:0 auto}}
@media(max-width:640px){
  .hx-card{padding:16px;gap:14px;border-radius:20px}
  .hx-n{width:32px;height:32px;font-size:13px}
  .hx-line{top:15px}
  .hx-st small{display:none}
  .hx-st b{font-size:12px}
  .hx-why{padding:14px}
  .hx-why-h b{font-size:16px}
  .hx-bar{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 24px;gap:8px;font-size:13px}
  .hx-feed{display:none}
}
.hero-grid.hx-grid h1{font-size:clamp(36px,4.4vw,52px)}
