/* Sections shared by the homepage, product and solution pages: the dotted route
   (Chip's agents on the homepage, "what comes next" on product pages) and the
   pop-out industry call to action. Moved out of home.css. */
.route{position:relative;padding:10px 0 20px}
.route svg.rline{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.rline .base{fill:none;stroke:color-mix(in srgb,var(--ink) 18%,transparent);stroke-width:3.5;stroke-linecap:round;stroke-dasharray:0 13}
.rline .prog{fill:none;stroke:var(--royal);stroke-width:4.5;stroke-linecap:round;stroke-dasharray:0 13}
.rline .rev{fill:none;stroke:#fff;stroke-width:14}
.traveler{position:absolute;left:0;top:0;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:var(--royal);display:grid;place-items:center;color:#fff;z-index:1;box-shadow:0 0 0 7px color-mix(in srgb,var(--royal) 18%,transparent);will-change:transform}
.traveler svg{width:16px;height:16px;stroke-width:3}
.rmark{position:relative;z-index:2;display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:999px;background:var(--surface);border:1.5px dashed color-mix(in srgb,var(--ink) 25%,transparent);font-weight:700;font-size:15px}
.rmark i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--c)}
.rmark i svg{width:14px;height:14px;stroke-width:2.6}
.rmark.start{margin-left:0}
.rmark.end{margin:64px 0 0 auto;display:flex;width:max-content;max-width:100%;margin-right:0}
.rmark.end.on{border-style:solid;border-color:var(--c-mon)}
.stops{list-style:none;margin:64px 0 0;padding:0;display:grid}
.stop:nth-child(even) .sphoto{order:2}
.stop:nth-child(even) .sflow{justify-content:flex-end}
.sphoto{position:relative;width:150px;height:150px}
.sphoto::before{content:"";position:absolute;inset:-10px;border-radius:50%;border:2px dashed color-mix(in srgb,var(--ink) 22%,transparent);transition:border-color .5s,transform .8s cubic-bezier(.2,.8,.2,1)}
.sphoto img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;filter:grayscale(1);opacity:.55;transform:scale(.92);transition:filter .6s,opacity .6s,transform .7s cubic-bezier(.2,.9,.3,1.2);background:var(--surface)}
.stop.on .sphoto img{filter:none;opacity:1;transform:none}
.stop.on .sphoto::before{border-color:var(--c);transform:rotate(40deg)}
.schip{position:absolute;bottom:-6px;left:50%;transform:translate(-50%,10px);background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:7px 10px;display:flex;gap:8px;align-items:center;box-shadow:0 14px 26px -14px rgba(12,22,56,.5);white-space:nowrap;text-align:left;opacity:0;transition:.5s cubic-bezier(.2,.8,.2,1) .15s}
.stop.on .schip{opacity:1;transform:translate(-50%,0)}
.schip .tico{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--c);color:#fff;flex:none}
.schip .tico svg{width:14px;height:14px}
.schip b{display:block;font-size:12.5px}
.schip small{display:block;font-size:11.5px;color:var(--muted)}
.stext{display:grid;gap:8px;opacity:.45;transition:opacity .6s}
.stop.on .stext{opacity:1}
.stext h3{font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:-.03em;font-weight:750}
.stext p{color:var(--ink-2);font-size:16px;max-width:44ch}
.stop:nth-child(even) .stext p{margin-left:auto}
.sflow{display:flex;flex-wrap:wrap;align-items:center;gap:2px 0;margin-top:4px}
.sflow span{font-size:13px;font-weight:600;padding:4px 9px;border-radius:7px;border:1.5px solid var(--line);color:var(--muted);transition:.4s;transition-delay:var(--fd,0s)}
.stop.on .sflow span{border-color:color-mix(in srgb,var(--c) 45%,transparent);color:var(--ink);background:color-mix(in srgb,var(--c) 9%,transparent)}
.sflow svg{width:30px;height:12px;flex:none;color:color-mix(in srgb,var(--ink) 30%,transparent);transition:color .4s;transition-delay:var(--fd,0s)}
.stop.on .sflow svg{color:var(--c)}
@media (max-width:820px){
.stop:nth-child(even) .sphoto{order:0}
.stop:nth-child(even) .sflow{justify-content:flex-start}
.stop:nth-child(even) .stext p{margin-left:0}
.sphoto{width:96px;height:96px}
.schip{display:none}
.stop.on .schip{transform:none}
.schip small{display:none}
.stext{padding-top:6px}
.rmark.start{margin-left:30px}
.rmark.end{margin:56px 0 0 30px;max-width:calc(100% - 30px)}
.sflow svg{width:18px}
}
.stext h3{line-height:1.02}
.pc-t{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;flex:none;color:var(--k);--ic-accent:var(--k);background:color-mix(in srgb,var(--k) 15%,#fff)}
.pc-t svg{width:15px;height:15px}
.icta-wrap{padding-top:96px;margin-bottom:clamp(56px,6.5vw,88px)}
.icta{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:end;border-radius:32px;background:color-mix(in srgb,var(--c,var(--royal)) 11%,#fff);transition:background-color .6s ease}
.icta-copy{padding:clamp(36px,5vw,64px) clamp(24px,4vw,56px);display:grid;gap:18px;align-content:center}
.icta-slide{display:grid;gap:16px;justify-items:start}
.icta-slide[hidden]{display:none}
.icta-slide.on{animation:ictaIn .6s cubic-bezier(.2,.8,.2,1)}
.icta-slide h2{font-size:clamp(2rem,3.8vw,3.1rem);max-width:17ch;letter-spacing:-.04em}
.icta-slide .lede{max-width:46ch}
.icta-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.icta-tabs button{position:relative;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 13px;border-radius:999px;border:1px solid color-mix(in srgb,var(--ink) 12%,transparent);background:rgba(255,255,255,.7);font:600 14px var(--fb);color:var(--ink-2);cursor:pointer;overflow:hidden}
.icta-tabs button .sb-icon{--ic-accent:var(--c)}
.icta-tabs button[aria-selected="true"]{background:#fff;color:var(--ink);border-color:var(--c)}
.icta-tabs .bar{position:absolute;left:12px;right:12px;bottom:4px;height:2px;border-radius:2px;opacity:0}
.icta-tabs .bar b{display:block;height:100%;width:0;background:var(--c);border-radius:2px}
.icta.running .icta-tabs [aria-selected="true"] .bar{opacity:1}
.icta.running .icta-tabs [aria-selected="true"] .bar b{animation:fill 6s linear forwards}
.icta-pv{position:relative;align-self:stretch;min-height:380px}
.icta-blob{position:absolute;left:50%;bottom:0;width:80%;aspect-ratio:1;border-radius:50% 50% 0 0;transform:translateX(-50%);background:var(--c,var(--royal));opacity:.16;transition:background-color .6s}
.icta-person{position:absolute;inset:0;opacity:0;transition:opacity .5s ease}
.icta-person.on{opacity:1}
.icta-cut{position:absolute;bottom:0;left:50%;transform:translateX(-50%) translateY(6%);height:calc((100% + 90px) * var(--s,1));max-height:calc(100% + 90px);width:auto;max-width:none;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.icta-person.on .icta-cut{transform:translateX(-50%)}
.icta-fc{position:absolute;z-index:3;right:2%;top:30%;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:16px;padding:10px 12px;box-shadow:0 18px 34px -18px rgba(12,22,56,.5);min-width:200px;transform:translateY(10px);opacity:0;transition:.6s cubic-bezier(.2,.8,.2,1) .25s}
.icta-person.on .icta-fc{transform:none;opacity:1}
.icta-fc small{display:block;font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.icta-fc div{display:flex;gap:9px;align-items:center}
.icta-fc b{font-size:13.5px;max-width:190px}
@keyframes ictaIn{from{opacity:0;transform:translateY(12px)}}
@media (prefers-reduced-motion:reduce){
.icta-slide.on{animation:none}
.icta-cut,.icta-fc,.icta-person{transition:none}
}
@media (max-width:860px){
.icta{grid-template-columns:minmax(0,1fr)}
.icta-wrap{padding-top:70px}
.icta-pv{min-height:340px;order:-1}
.icta-cut{height:calc((100% + 60px) * var(--s,1));max-height:calc(100% + 60px)}
.icta-fc{right:4%;top:auto;bottom:10%;min-width:0}
}
.icta-slide .hero-ctas .btn{white-space:nowrap}
@media (max-width:480px){
.icta-slide .hero-ctas{width:100%}
.icta-slide .hero-ctas .btn{flex:1 1 auto;justify-content:center}
}
.sag{position:relative;width:100%;height:100%;border-radius:50%;display:grid;place-items:center;color:var(--c);--ic-accent:var(--c);background:color-mix(in srgb,var(--c) 12%,var(--surface));filter:grayscale(1);opacity:.55;transform:scale(.92);transition:filter .6s,opacity .6s,transform .7s cubic-bezier(.2,.9,.3,1.2)}
.sag>svg{width:44%;height:44%}
.sag>.ico{stroke-width:1.5}
.stop.on .sag{filter:none;opacity:1;transform:none}
.sag-chip{position:absolute;right:2%;top:2%;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 8px 18px -8px rgba(12,22,56,.45)}
.schip .tico .sb-brand{width:14px;height:14px;color:#fff}
.agents-more{margin-top:40px;text-align:center}
@media (max-width:820px){
.sag-chip{width:30px;height:30px}
.sag-chip svg{width:15px;height:15px}
}
@keyframes fill{to{width:100%}}

/* the route's stops (were in home-top.css) */
.stop{position:relative;z-index:2;display:grid;grid-template-columns:150px minmax(0,1fr);gap:28px;align-items:center;width:min(640px,58%)}
.stop+.stop{margin-top:64px}
.stop:nth-child(even){margin-left:auto;grid-template-columns:minmax(0,1fr) 150px;text-align:right}
@media (max-width:820px){
  .stop,.stop:nth-child(even){width:100%;margin-left:0;grid-template-columns:96px minmax(0,1fr);text-align:left;gap:18px;align-items:start}
  .stop+.stop{margin-top:42px}
}