/* Seção "Nossos pilares": trilha em fases (Missão, Visão, Valores, Ética, Manifesto).
   Tudo com escopo em #pilares e classes p8-*, para não interferir no restante do site. */
@property --p8ang{syntax:"<angle>";initial-value:0deg;inherits:false}
#pilares{--p8ease:cubic-bezier(.2,.8,.2,1);--c0:var(--orange);--c1:var(--amber);--c2:var(--blue)}
#pilares .p8-stage{position:relative;flex:1;height:clamp(380px,calc(100svh / var(--z,1) - 330px),600px);margin-top:2px}
#pilares svg.p8-path{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
#pilares .p8-p-base{fill:none;stroke:rgba(21,84,230,.12);stroke-width:2;stroke-dasharray:2 9;stroke-linecap:round}
#pilares .p8-p-draw{fill:none;stroke:url(#p8-g);stroke-width:6;stroke-linecap:round;opacity:.22}
#pilares .p8-p-prog{fill:none;stroke:url(#p8-g);stroke-width:7;stroke-linecap:round;filter:drop-shadow(0 4px 10px rgba(255,90,18,.35))}
#pilares .p8-p-flow{fill:none;stroke:#fff;stroke-opacity:.9;stroke-width:2;stroke-linecap:round;stroke-dasharray:1 16;animation:p8-flow 1.6s linear infinite}
@keyframes p8-flow{to{stroke-dashoffset:-34}}
#pilares #p8-pl{filter:drop-shadow(0 6px 10px rgba(255,90,18,.55))}
#pilares .p8-nd{position:absolute;left:calc(var(--x)*100%);top:calc(var(--y)*100%);width:0;height:0;opacity:0;animation:p8-pop .7s var(--p8ease) forwards;animation-delay:calc(var(--k)*260ms + 200ms);transition:opacity .35s}
@keyframes p8-pop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
#pilares .p8-stage.p8-has-open .p8-nd:not(.p8-cur){opacity:.55!important}
#pilares .p8-nd.p8-cur{z-index:20}
#pilares .p8-dot{all:unset;box-sizing:border-box;cursor:pointer;position:absolute;left:0;top:0;width:var(--s,116px);height:var(--s,116px);margin:calc(var(--s,116px)/-2) 0 0 calc(var(--s,116px)/-2);border-radius:50%;display:grid;place-items:center;color:#fff;
 background:linear-gradient(135deg,var(--c),var(--c2));box-shadow:0 16px 30px -10px var(--c);transition:transform .45s var(--p8ease),filter .5s,opacity .5s,box-shadow .5s}
#pilares .p8-nd.p8-mi{--c:var(--orange);--c2:#ff8a3c}
#pilares .p8-nd.p8-vi{--c:var(--blue);--c2:#4d86ff}
#pilares .p8-nd.p8-va{--c:var(--amber);--c2:#ffd060}
#pilares .p8-nd.p8-et{--c:#0b2f8f;--c2:var(--blue)}
#pilares .p8-nd.p8-mf{--c:var(--orange);--c2:var(--blue)}
#pilares .p8-nd.p8-mf .p8-tt{font-size:1.02rem}
#pilares .p8-bub.p8-wide{width:min(520px,calc(100vw - 32px))}
#pilares .p8-story{list-style:none;padding:0;display:grid;gap:9px;position:relative}
#pilares .p8-story li{font-weight:600;font-size:.9rem;line-height:1.45;color:#2c3550;padding-left:14px;border-left:3px solid var(--amber)}
#pilares .p8-story li:nth-child(1){border-color:var(--orange)}
#pilares .p8-story li:nth-child(4){border-color:var(--blue)}
#pilares .p8-story b{color:var(--ink);font-weight:800}
#pilares .p8-prop{margin-top:12px;padding-top:11px;border-top:1px dashed #d6dcec;font:italic 800 1.05rem/1.3 var(--f-display)}
#pilares .p8-prop em{color:var(--orange);font-style:italic}
#pilares .p8-dot .p8-tt{font:italic 800 1.22rem/1 var(--f-display);text-shadow:0 2px 8px rgba(0,0,0,.18);letter-spacing:-.01em;position:relative;z-index:2}
#pilares .p8-nd.p8-va .p8-tt{color:var(--ink);text-shadow:none}
#pilares .p8-dot .p8-ic{display:none;width:40%;height:40%}
#pilares .p8-dot .p8-ic svg{width:100%;height:100%}
#pilares .p8-dot .p8-ring{position:absolute;inset:-8px;border-radius:50%;padding:2.5px;background:conic-gradient(from var(--p8ang),var(--orange),var(--amber),var(--blue),transparent 60%,var(--orange));
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);opacity:0;transition:opacity .4s;animation:p8-spin 5s linear infinite}
@keyframes p8-spin{to{--p8ang:360deg}}
#pilares .p8-nd:not(.p8-lock) .p8-dot:hover,#pilares .p8-nd.p8-cur .p8-dot{transform:scale(1.1)}
#pilares .p8-nd.p8-cur .p8-ring,#pilares .p8-nd:not(.p8-lock) .p8-dot:hover .p8-ring{opacity:1}
#pilares .p8-nd.p8-cur .p8-dot:before{content:"";position:absolute;inset:-4px;border-radius:50%;border:3px solid var(--c);opacity:0;animation:p8-rad 2s ease-out infinite;pointer-events:none}
@keyframes p8-rad{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.55);opacity:0}}
#pilares .p8-nd.p8-lock .p8-dot{filter:grayscale(.9) brightness(1.08);opacity:.5;box-shadow:none}
#pilares .p8-nd.p8-lock .p8-lbl{opacity:.5}
#pilares .p8-nd.p8-just .p8-dot{animation:p8-unl .9s var(--p8ease)}
@keyframes p8-unl{0%{transform:scale(.8)}45%{transform:scale(1.22)}100%{transform:scale(1.1)}}
#pilares .p8-lbl{position:absolute;left:0;top:calc(var(--s,116px)/2 + 10px);transform:translateX(-50%);text-align:center;white-space:nowrap;pointer-events:none;transition:opacity .4s}
#pilares .p8-nd.p8-mf .p8-lbl{top:58px}
#pilares .p8-lbl b{display:none}
#pilares .p8-lbl small{display:block;font:600 .72rem var(--f-data);letter-spacing:.06em;color:var(--steel)}
#pilares .p8-bub{position:absolute;left:0;width:min(450px,calc(100vw - 32px));background:#fff;border-radius:26px;padding:20px 22px 18px;box-shadow:0 30px 70px -18px rgba(13,30,100,.45);visibility:hidden;opacity:0;
 transform:translate(var(--tx),calc(-50% + var(--sy,0px))) scale(.96);transition:opacity .3s,transform .45s var(--p8ease),visibility 0s .3s;--cc:var(--c);overflow:hidden}
#pilares .p8-nd.p8-sr.p8-open .p8-bub{visibility:visible;opacity:1;transform:translate(0,calc(-50% + var(--sy,0px)));transition-delay:0s}
#pilares .p8-nd.p8-sl.p8-open .p8-bub{visibility:visible;opacity:1;transform:translate(calc(-100% - var(--s,116px)/2 - 26px),calc(-50% + var(--sy,0px)));transition-delay:0s}
#pilares .p8-bub:before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2.5px;background:conic-gradient(from var(--p8ang),var(--orange),var(--amber),var(--blue),transparent 60%,var(--orange));
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:p8-spin 6s linear infinite;pointer-events:none}
#pilares .p8-bub{top:0;--tx:0px}
#pilares .p8-nd.p8-sr .p8-bub{left:calc(var(--s,116px)/2 + 26px);--tx:14px}
#pilares .p8-nd.p8-sl .p8-bub{left:0;--tx:calc(-100% - var(--s,116px)/2 - 26px - 14px)}
#pilares .p8-gh{position:absolute;right:-20px;top:-16px;width:150px;height:150px;color:var(--c);opacity:.07;pointer-events:none}
#pilares .p8-gh svg{width:100%;height:100%;stroke-width:1.1}
#pilares .p8-bh{display:flex;align-items:center;gap:14px;margin-bottom:12px;position:relative}
#pilares .p8-bh h3{margin:0}
#pilares .p8-bi{flex:none;width:56px;height:56px;border-radius:18px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--c),var(--c2));box-shadow:0 10px 22px -8px var(--c),0 0 0 6px color-mix(in srgb,var(--c) 14%,transparent),inset 0 1px 0 rgba(255,255,255,.35)}
#pilares .p8-nd.p8-va .p8-bi{color:var(--ink)}
#pilares .p8-bi svg{width:50%;height:50%}
#pilares .p8-bh small{display:block;font:600 .68rem var(--f-data);letter-spacing:.16em;text-transform:uppercase;color:var(--steel);margin-bottom:2px}
#pilares .p8-bh h3{font:italic 800 1.5rem/1.05 var(--f-display)}
#pilares .p8-bt{font-weight:600;font-size:.98rem;line-height:1.6;color:#2c3550;position:relative}
#pilares .p8-bt.p8-sw{animation:p8-sw .4s var(--p8ease)}
@keyframes p8-sw{from{opacity:0;transform:translateY(6px)}}
#pilares .p8-nd.p8-et .p8-bub{background:linear-gradient(135deg,#1554e6,#0b2f8f);color:#fff}
#pilares .p8-nd.p8-et .p8-bub .p8-bt{color:#e9efff}
#pilares .p8-nd.p8-et .p8-bh small{color:#bcd0ff}
#pilares .p8-nd.p8-et .p8-gh{color:#fff;opacity:.1}
#pilares .p8-vt{min-height:4.9em}
#pilares .p8-vcs{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px;position:relative}
#pilares .p8-vc{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:7px;padding:4px 11px 4px 4px;border-radius:99px;background:#f2f5fc;font:700 .76rem/1.15 var(--f-body);color:var(--ink);border:1.5px solid transparent;transition:all .25s var(--p8ease)}
#pilares .p8-vc .p8-ci{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--cc),color-mix(in srgb,var(--cc) 60%,#fff));flex:none}
#pilares .p8-vc .p8-ci svg{width:58%;height:58%}
#pilares .p8-vc:hover,#pilares .p8-vc.p8-on,#pilares .p8-vc:focus-visible{background:#fff;border-color:var(--cc);box-shadow:0 8px 16px -8px var(--cc)}
#pilares .p8-bp{position:absolute;left:0;top:0;width:14px;height:16px;margin:-8px 0 0 -7px;background:var(--pc);clip-path:polygon(0 0,60% 0,100% 50%,60% 100%,0 100%,40% 50%);pointer-events:none;z-index:40;animation:p8-bp .95s var(--p8ease) forwards}
@keyframes p8-bp{from{transform:translate(0,0) rotate(0) scale(.4);opacity:1}to{transform:translate(var(--dx),var(--dy)) rotate(var(--r)) scale(1);opacity:0}}
@media (max-width:820px){#pilares .p8-stage{height:auto;min-height:0;display:flex;flex-direction:column;gap:6px;padding:10px 0 20px 6px;margin-top:10px}
#pilares .p8-stage:before{content:"";position:absolute;left:41px;top:30px;bottom:50px;width:4px;border-radius:4px;background:#dfe5f3}
#pilares .p8-stage:after{content:"";position:absolute;left:41px;top:30px;width:4px;border-radius:4px;background:linear-gradient(var(--orange),var(--amber),var(--blue));height:var(--pg,0px);transition:height .8s var(--p8ease)}
#pilares svg.p8-path{display:none}
#pilares .p8-nd{position:relative;left:auto;top:auto;width:auto;height:auto;display:grid;grid-template-columns:70px 1fr;column-gap:14px;align-items:center;min-height:70px;z-index:2}
#pilares .p8-dot{position:relative;margin:0;--s:64px;grid-row:1;width:64px;height:64px}
#pilares .p8-dot .p8-tt{display:none}
#pilares .p8-dot .p8-ic{display:block}
#pilares .p8-nd.p8-va .p8-dot .p8-ic{color:var(--ink)}
#pilares .p8-lbl{position:static;transform:none;text-align:left;grid-row:1;grid-column:2}
#pilares .p8-lbl b{display:block;font:italic 800 1.25rem/1.1 var(--f-display)}
#pilares .p8-nd.p8-mf .p8-lbl{top:auto}
#pilares .p8-nd .p8-bub,#pilares .p8-nd.p8-sr .p8-bub,#pilares .p8-nd.p8-sl .p8-bub,#pilares .p8-nd.p8-sr.p8-open .p8-bub,#pilares .p8-nd.p8-sl.p8-open .p8-bub{position:relative;grid-column:1/-1;width:auto;max-width:none;left:auto!important;bottom:auto!important;top:auto!important;transform:none!important;margin:10px 0 6px;display:none;visibility:visible;opacity:1;box-shadow:0 12px 30px -12px rgba(13,30,100,.3)}
#pilares .p8-nd.p8-open .p8-bub,#pilares .p8-nd.p8-sr.p8-open .p8-bub,#pilares .p8-nd.p8-sl.p8-open .p8-bub{display:block;animation:p8-sw .4s var(--p8ease)}
#pilares .p8-stage.p8-has-open .p8-nd:not(.p8-cur){opacity:1!important}
}
@media (prefers-reduced-motion:reduce){#pilares *{animation:none!important;transition:none!important}#pilares .p8-nd{opacity:1}}