/* A cena permanece legível sem JavaScript e sem animações. */
/* Disable anchoring only while initial sticky heights are being established. */
html:not(.why-scene-ready),html.why-height-active{overflow-anchor:none}
.why.section{padding:0;background:#000;color:#fff}
.why-stage{--why-normal-padding:78px;--why-initial-top:112px;--why-initial-bottom:48px;position:relative;isolation:isolate;padding:var(--why-normal-padding) 0;background:#000}
.why-particles{position:absolute;inset:0;width:100%;height:var(--why-particle-height,100%);display:block;z-index:-1;pointer-events:none}
.why-title em{color:inherit}
.why-word{display:inline-block;white-space:pre;transform-origin:center center}
.why-scroll-enabled{height:var(--why-scene-height)}
.why-scroll-enabled>.why-scroll-flow{position:sticky;top:0;display:flow-root}
:where(.why-scroll-flow>section:not(.dark):not(.mission)) :is(h1,h2,h3,h4,h5,h6){color:#222222}
.why-motion-enabled .why-stage{
 height:var(--why-stage-height,100svh);padding:var(--why-padding-top,112px) 0 var(--why-padding-bottom,48px);
 display:flex;align-items:center;overflow:clip;
}
.why-motion-enabled .why-word{will-change:transform}
.why-motion-enabled .features{transform:translateY(var(--why-grid-offset,0px))}
.why-motion-enabled .features>article{
 opacity:var(--why-feature-opacity,0);
 transform:translateY(var(--why-feature-offset,24px));
}
.why-motion-enabled .features>article:focus-within{
 opacity:1;transform:none;
}
@media(max-width:1000px){.why-stage{--why-normal-padding:60px}}
@media(max-width:760px){
 .why-stage{--why-normal-padding:48px;--why-initial-top:100px;--why-initial-bottom:36px}
}
@media(prefers-reduced-motion:reduce){
 .why-scroll-enabled{height:auto}
 .why-scroll-enabled>.why-scroll-flow{position:static}
 .why-motion-enabled .why-stage{height:auto;display:block;padding:var(--why-normal-padding) 0}
 .why-motion-enabled .why-word{transform:none!important;will-change:auto}
 .why-motion-enabled .features>article{opacity:1;transform:none;transition:none}
}

/* Icones animados dos diferenciais (why-icons.js).
   O traco se desenha com a mesma variavel de rolagem da entrada; sem ela, o icone fica pronto. */
.features .why-ico{
 --why-accent:#1fffe7;width:92px;height:92px;display:block;margin:0 auto 18px;overflow:visible;
 color:#fff;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
}
.why-ico .d{stroke-dasharray:100;stroke-dashoffset:calc((1 - var(--why-feature-opacity,1))*100)}
.why-ico .f{opacity:var(--why-feature-opacity,1)}
.why-ico .a{stroke:var(--why-accent)}
.why-ico .af{fill:var(--why-accent);stroke:none}
.why-ico .wf{fill:currentColor;stroke:none}
.why-ico .k{stroke:#00191b;stroke-width:2.2}
.why-ico .hex{stroke:#ffffff3d;stroke-width:1.5}
.why-ico .run{stroke:var(--why-accent);stroke-dasharray:16 84;opacity:0}
.why-ico :is(.t,.ping){transform-box:fill-box;transform-origin:center}
.why-ico .tb{transform-box:fill-box;transform-origin:50% 100%}
.why-ico :is(.ping,.ring,.spark,.sparks,.knot){opacity:0}
.why-ico .ping{stroke:var(--why-accent);stroke-width:1.5}
.why-ico .knot{stroke:#ffffffb3;stroke-dasharray:100;stroke-dashoffset:100}
.why-ico .bolt{fill:#1fffe721}
.why-bar{display:block;width:44px;height:2px;margin:16px auto 0;border-radius:2px;background:#ffffff26;overflow:hidden;opacity:0;transition:opacity .4s ease}
.why-bar i{display:block;height:100%;background:#1fffe7;transform:scaleX(0);transform-origin:0 50%}
.why-tour-on .why-bar{opacity:1}
/* Tour: um diferencial em destaque por vez; os outros recuam sem sumir. */
.features.why-tour-on>article :is(.why-ico,h3,p){transition:opacity .5s ease,color .5s ease,transform .6s cubic-bezier(.2,.9,.25,1.25),filter .5s ease}
.features.why-tour-on>article:not(.is-active) :is(.why-ico,h3,p){opacity:.62}
.features>article.is-active .why-ico{transform:scale(1.1);filter:drop-shadow(0 0 16px #1fffe75c)}
.features>article.is-active h3{color:#1fffe7}
.features>article.is-live .ping{animation:why-ping .9s cubic-bezier(.2,.7,.2,1) both}
.features>article.is-active .run{opacity:1;animation:why-run 2.4s linear infinite}
.features>article.is-active .why-bar i{animation:why-bar 4.2s linear both}
.is-active .why-ico-1 .br{animation:why-lock .9s cubic-bezier(.2,.9,.25,1.2) .15s both}
.is-active .why-ico-1 .who{animation:why-tint 3.4s ease .8s both}
.is-active .why-ico-1 .ring{animation:why-ring 1.1s ease-out .9s both}
.is-active .why-ico-2 .knot{animation:why-knot 1.9s ease-in-out both}
.is-active .why-ico-2 .bolt{animation:why-strike 2.3s cubic-bezier(.2,.9,.25,1.2) both}
.is-active .why-ico-2 .sparks{animation:why-ring .8s ease-out 1.75s both}
.is-active .why-ico-3 .bar{animation:why-grow .7s cubic-bezier(.2,.9,.3,1.3) both}
.is-active .why-ico-3 .b1{animation-delay:.3s}
.is-active .why-ico-3 .b2{animation-delay:.48s}
.is-active .why-ico-3 .b3{animation-delay:.66s}
.is-active .why-ico-3 .note{animation:why-pop .55s cubic-bezier(.2,.9,.3,1.4) 1.5s both}
.is-active .why-ico-4 .bar{animation:why-rise .8s cubic-bezier(.2,.9,.3,1.3) both}
.is-active .why-ico-4 .b1{animation-delay:.25s}
.is-active .why-ico-4 .b2{animation-delay:.45s}
.is-active .why-ico-4 .b3{animation-delay:.65s}
.is-active .why-ico-4 .trend{animation:why-draw .9s ease-in-out 1.2s both}
.is-active .why-ico-4 .tip{animation:why-draw .35s ease-out 2s both}
.is-active .why-ico-4 .spark{animation:why-ring .9s ease-out 2.2s both}
.is-active .why-ico-5 .dot{animation:why-type .5s ease-in-out 3 both}
.is-active .why-ico-5 .d1{animation-delay:.2s}
.is-active .why-ico-5 .d2{animation-delay:.32s}
.is-active .why-ico-5 .d3{animation-delay:.44s}
.is-active .why-ico-5 .reply{animation:why-pop .55s cubic-bezier(.2,.9,.3,1.4) 1.9s both}
.why-tour-paused .is-active :is(.why-ico *,.why-bar i){animation-play-state:paused}
@media(hover:hover){.features>article.is-active:hover .why-bar i{animation-play-state:paused}}
@keyframes why-run{to{stroke-dashoffset:-100}}
@keyframes why-bar{to{transform:scaleX(1)}}
@keyframes why-ping{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.5)}}
@keyframes why-ring{0%{opacity:0;transform:scale(.5)}20%{opacity:.9}100%{opacity:0;transform:scale(1.6)}}
@keyframes why-lock{0%{opacity:0;transform:scale(1.55) rotate(-20deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes why-tint{0%,100%{stroke:#fff}12%,82%{stroke:#1fffe7}}
@keyframes why-knot{0%{opacity:1;stroke-dashoffset:100}40%,58%{opacity:1;stroke-dashoffset:0}99%{opacity:1;stroke-dashoffset:-100}100%{opacity:0;stroke-dashoffset:-100}}
@keyframes why-strike{0%,70%{opacity:0;transform:scale(.5)}82%{opacity:1;transform:scale(1.2)}100%{opacity:1;transform:scale(1)}}
@keyframes why-grow{0%{transform:scaleY(0)}100%{transform:scaleY(1)}}
@keyframes why-rise{0%{transform:scaleY(.25)}100%{transform:scaleY(1)}}
@keyframes why-pop{0%{opacity:0;transform:scale(0)}100%{opacity:1;transform:scale(1)}}
@keyframes why-draw{0%{stroke-dashoffset:100}100%{stroke-dashoffset:0}}
@keyframes why-type{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(max-width:760px){.features .why-ico{width:64px;height:64px;margin-bottom:10px}.why-bar{margin-top:10px}}
@media(prefers-reduced-motion:reduce){
 .why-ico,.why-ico *,.why-bar i{animation:none!important;transition:none!important}
 .why-bar{display:none}
}
