/* "From your data to decisions" ring, shared with the main site (copied from style.css; product sites use it per product) */
:root{--ink-2:var(--ink2,#3d3437);--grad-text:var(--gtext,linear-gradient(100deg,#ff3b3b 0%,#e0101c 45%,#9e0c26 100%));--muted:var(--mut,#7a7073)}
.dflow-sec{background:#fff}
.df-head{text-align:center;margin-bottom:30px}.df-head h2{margin-top:12px;font-weight:400;font-size:clamp(2rem,4vw,3.2rem)}
.dflow{display:grid;grid-template-columns:220px 1fr 240px;align-items:center;gap:24px}
.df-in,.df-out{list-style:none;display:grid;gap:26px}
.df-in li,.df-out li{position:relative;font-size:1rem;color:var(--ink-2);opacity:0;transition:.6s}
.df-in li{text-align:right;padding-right:34px}.df-out li{padding-left:34px}
.df-in li::after,.df-out li::before{content:"";position:absolute;top:50%;width:22px;border-top:1px dashed #c9b9bc}
.df-in li::after{right:0}.df-out li::before{left:0}
.df-in li::before,.df-out li::after{content:"";position:absolute;top:calc(50% - 4px);width:8px;height:8px;border-radius:50%;background:#d9cdd0}
.df-in li::before{right:-6px}.df-out li::after{left:-6px}
.df-core{position:relative;aspect-ratio:1;max-width:540px;margin:0 auto;width:100%}
.df-ring{position:absolute;inset:0;width:100%;height:100%}
.df-arc{stroke-dasharray:1288;stroke-dashoffset:1288;transition:stroke-dashoffset 2s cubic-bezier(.2,.7,.2,1)}
.df-node,.df-node.l,.df-node.r{position:absolute;top:50%;width:28%;aspect-ratio:1;border-radius:50%;border:1.5px solid #d9cdd0;background:#fff;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;z-index:4;opacity:0;transition:.6s;padding:10px 14px!important;box-shadow:0 4px 18px -4px rgba(20,16,18,.08);box-sizing:border-box}
.df-node b,.df-node.r b,.df-node.l b{display:block!important;width:100%!important;max-width:100%!important;font-size:clamp(.82rem,1.15vw,.96rem)!important;font-weight:600!important;line-height:1.22!important;text-align:center!important;color:var(--red,#e0101c);background:var(--grad-text,linear-gradient(100deg,#ff3b3b 0%,#e0101c 45%,#9e0c26 100%))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;text-wrap:balance!important;word-break:normal!important;white-space:normal!important}
.df-node.l{left:10.58%!important;transform:translate(-50%,-50%)!important;right:auto!important}
.df-node.r{left:89.42%!important;transform:translate(-50%,-50%)!important;right:auto!important}
.df-band{position:absolute;left:10.58%;right:10.58%;top:36.5%;height:27%;border-top:1px dashed #d9cdd0;border-bottom:1px dashed #d9cdd0;background:rgba(255,255,255,.95);display:grid;grid-template-columns:repeat(5,1fr);align-items:center;z-index:2;overflow:hidden;padding:0 10%}
.df-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;height:100%;opacity:0;transform:translateY(8px);transition:.5s;min-width:0}
.df-stage small{font-size:clamp(.62rem,.9vw,.75rem);font-weight:600;color:var(--ink-2);text-align:center;line-height:1.2;height:2.6em;display:flex;align-items:flex-end;justify-content:center;width:100%;padding:0 2px;min-width:0;word-break:normal}
.tl{position:relative;width:50px;height:50px;flex:none}
.tl i{position:absolute;width:10px;height:10px;border:1.5px solid var(--red);border-radius:2px;box-sizing:border-box}
.tl.s i{border-color:#c9b9bc;background:#ece3e4}
.tl.l i{border-color:#e98a8f}
.tl.g.v i{background:#fff0f0}
.tl.bars{display:flex!important;align-items:flex-end!important;justify-content:center!important;gap:5px!important;padding:0 4px!important;height:50px!important;width:50px!important;border:none!important}
.tl.bars i{position:static!important;width:8px;border:1.5px solid var(--red);border-radius:2px 2px 0 0;background:#ffe4e4;transform-origin:bottom;transform:scaleY(0);transition:transform .8s;box-sizing:border-box}
.df-p{position:absolute;top:calc(50% + 17px);left:-10px;width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red),0 0 4px #fc1414;opacity:0;transform:translateY(-50%);animation:dfp 3s linear infinite;pointer-events:none;z-index:3}
@keyframes dfp{0%{left:2%;opacity:0}8%{opacity:1}92%{opacity:1}100%{left:98%;opacity:0}}
.df-badge{position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.82rem;font-weight:600;color:var(--ink-2);z-index:3;opacity:0;transform:scale(.6);transition:.5s cubic-bezier(.2,1.4,.4,1)}
.df-badge span{width:60px;height:60px;border-radius:50%;background:#fff;border:1.5px solid #d9cdd0;display:grid;place-items:center;font-size:1.3rem;box-shadow:0 10px 24px -14px rgba(252,20,20,.4)}
.df-badge.b1{left:50%;top:-1%;transform-origin:center;translate:-50% 0}
.df-badge.b2{left:21%;bottom:-1%}.df-badge.b3{right:21%;bottom:-1%}
/* in-view sequence */
.dflow.in .df-arc{stroke-dashoffset:0}
.dflow.in .df-node{opacity:1}.dflow.in .df-node.r{transition-delay:.4s}
.dflow.in .df-stage{opacity:1;transform:none}
.dflow.in .df-stage:nth-child(2){transition-delay:.3s}.dflow.in .df-stage:nth-child(3){transition-delay:.6s}.dflow.in .df-stage:nth-child(4){transition-delay:.9s}.dflow.in .df-stage:nth-child(5){transition-delay:1.2s}
.dflow.in .tl.bars i{transform:scaleY(1);transition-delay:1.5s}
.dflow.in .df-badge{opacity:1;transform:scale(1)}.dflow.in .b1{transition-delay:1.4s}.dflow.in .b2{transition-delay:1.6s}.dflow.in .b3{transition-delay:1.8s}
.dflow.in .df-in li,.dflow.in .df-out li{opacity:1}
.dflow.in .df-in li:nth-child(n){transition-delay:calc(.15s * var(--i,1))}
.dflow.in .df-out li{transition-delay:1.6s}
@media(max-width:1080px){.dflow{grid-template-columns:1fr;gap:28px}.df-in,.df-out{grid-template-columns:1fr 1fr;gap:12px}.df-in li,.df-out li{text-align:left;padding:10px 14px;border:1px solid var(--line);border-radius:10px;opacity:1}.df-in li::before,.df-in li::after,.df-out li::before,.df-out li::after{display:none}.df-core{max-width:520px}}
@media(max-width:580px){.df-stage small{font-size:.62rem}.tl{transform:scale(.8);transform-origin:center}.df-band{padding:0 8%}.df-badge span{width:48px;height:48px;font-size:1.1rem}.df-badge{font-size:.72rem}}
@media (prefers-reduced-motion:reduce){.df-p{display:none}}
@media(max-width:640px){
 .df-head{text-align:left}
 .df-in,.df-out{grid-template-columns:1fr;gap:8px}
 .df-core{aspect-ratio:auto;max-width:none;display:flex;flex-direction:column;gap:10px;margin:18px 0}
 .df-ring,.df-p{display:none}
 .df-node,.df-badge,.df-band{position:static!important;transform:none!important;translate:none!important;opacity:1!important}
 .df-node{width:auto!important;aspect-ratio:auto!important;border-radius:12px;padding:12px 16px!important;place-items:start}
 .df-band{display:grid;grid-template-columns:1fr;gap:0;border:1px solid var(--line);border-radius:12px;background:#fff;height:auto;padding:0}
 .df-stage{flex-direction:row;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line);opacity:1;transform:none;height:auto}
 .df-stage:last-child{border-bottom:0}
 .df-stage small{font-size:.95rem;min-height:0;height:auto;text-align:left;color:var(--ink);display:block}
 .df-stage small br{display:none}
 .tl{transform:scale(.7);transform-origin:right center}
 .tl.bars i{transform:scaleY(1)}
 .df-core .df-badge{display:none}
 .df-node.r{order:3}.df-band{order:2}
}