:root{
--rv-t-toque:120ms;
--rv-t-estado:240ms;
--rv-t-folha:340ms;
--rv-e-entra:cubic-bezier(.16,1,.3,1);
--rv-e-sai:cubic-bezier(.4,0,1,1);
--rv-desloca:30px;
}
@supports (animation-timeline: view()){
@media (prefers-reduced-motion:no-preference){
.rv-revela-ao-rolar{
animation:rv-surge linear both;
animation-timeline:view();
animation-range:entry 0 entry 260px;
}
@keyframes rv-surge{
from{ opacity:0; transform:translateY(var(--rv-desloca)); }
to { opacity:1; transform:none; }
}
:is(.rv-grade,.rv-provas,.rv-faixa-dados)>.rv-revela-ao-rolar:nth-child(3n+2){
animation-range:entry 45px entry 305px}
:is(.rv-grade,.rv-provas,.rv-faixa-dados)>.rv-revela-ao-rolar:nth-child(3n+3){
animation-range:entry 90px entry 350px}
.rv-secao>.rv-linha-corte,
.rv-lado__dado,
.rv-faq{
animation:rv-risca linear both;
animation-timeline:view();
animation-range:entry 0 entry 220px;
transform-origin:left center;
}
@keyframes rv-risca{
from{ transform:scaleX(0); }
to { transform:scaleX(1); }
}
.rv-lado__dado,.rv-faq{animation-name:rv-surge}
.rv-grafico__barra{
animation:rv-cresce linear both;
animation-timeline:view();
animation-range:entry 0 entry 240px;
}
@keyframes rv-cresce{
from{ transform:scaleY(0); }
to { transform:scaleY(1); }
}
.rv-grafico__col:nth-child(2) .rv-grafico__barra{animation-range:entry 40px entry 280px}
.rv-grafico__col:nth-child(3) .rv-grafico__barra{animation-range:entry 80px entry 320px}
.rv-grafico__col:nth-child(4) .rv-grafico__barra{animation-range:entry 120px entry 360px}
.rv-grafico__col:nth-child(5) .rv-grafico__barra{animation-range:entry 160px entry 400px}
.rv-grafico__col:nth-child(6) .rv-grafico__barra{animation-range:entry 200px entry 440px}
}
}
.rv-item::after{
content:""; position:absolute; left:0; right:0; top:0;
height:var(--rv-faixa,4px); background:var(--rv-amarelo);
transform:scaleX(0); transform-origin:left center;
pointer-events:none; z-index:2;
transition:transform var(--rv-t-estado) var(--rv-e-entra);
}
@media (hover:hover){ .rv-item:hover::after{ transform:scaleX(1); } }
.rv-item:focus-within::after,
.rv-item:has(.rv-item__alvo:active)::after{ transform:scaleX(1); }
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{
animation-duration:.01ms !important;
animation-iteration-count:1 !important;
transition-duration:.01ms !important;
scroll-behavior:auto !important;
}
.rv-revela-ao-rolar{ opacity:1 !important; transform:none !important; }
.rv-grafico__barra{ transform:none !important; }
.rv-item::after{ transform:scaleX(1) !important; }
.rv-caderno__trilha{ animation:none !important; transform:none !important; }
}