/* Movimento leve (movimento.js). Só vale com html.mov, que o script põe quando não há pedido de movimento reduzido. */
.mov .mov-entra{transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--mov-atraso,0ms)}
.mov .mov-entra:not(.mov-on){opacity:0;transform:translateY(18px)}

/* filetes de cima que se desenham da esquerda para a direita */
.mov .mov-linha{position:relative;border-top-color:transparent!important}
.mov .mov-linha::before{content:"";position:absolute;left:0;right:0;top:-2px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.6,0,.2,1) .1s}
.mov .rm-riscos li.mov-linha::before,.mov .b-ferr-grid a.mov-linha::before,.mov .a-box.mov-linha::before{top:-2px}
.mov .oh-nums.mov-linha::before,.mov .csd-passos li.mov-linha::before{top:-1px;height:1px;background:var(--line)}
.mov .mov-linha.mov-on::before{transform:scaleX(1)}

/* número antigo dos casos: o risco se desenha por cima */
.mov .cs-de{position:relative;text-decoration:none}
.mov .cs-de::after{content:"";position:absolute;left:-2px;right:-2px;top:52%;height:2px;background:rgba(85,97,115,.7);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.6,0,.2,1) .35s}
.mov .mov-on .cs-de::after,.mov .cs-num.mov-on .cs-de::after,.mov .cs-destaque.mov-on .cs-de::after,.mov .cs-item.mov-on .cs-de::after{transform:scaleX(1)}
.mov .cs-seta{display:inline-block;transition:transform .5s ease .5s,opacity .5s ease .5s}
.mov .cs-item:not(.mov-on) .cs-seta,.mov .cs-destaque:not(.mov-on) .cs-seta{opacity:0;transform:translateX(-8px)}

/* mapa do Olhar: estados acendem do oeste para o leste */
.mov .mov-mapa svg path{transition:opacity .6s ease;transition-delay:var(--mov-atraso,0ms)}
.mov .mov-mapa:not(.mov-on) svg path{opacity:0}

/* topo da página inicial: a frase entra em dois tempos */
.mov .ed-hero h1{animation:mov-sobe .9s cubic-bezier(.2,.7,.2,1) both}
.mov .ed-hero h1 .hero-last{display:inline-block;animation:mov-sobe .9s cubic-bezier(.2,.7,.2,1) .25s both}
.mov .ed-hero .ed-kicker,.mov .ed-hero h1~*{animation:mov-aparece .8s ease .5s both}
@keyframes mov-sobe{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes mov-aparece{from{opacity:0}to{opacity:1}}

/* pequenas respostas ao mouse */
.mov .cs-item,.mov .rm-riscos li{transition:background-color .25s ease}
.mov .text-link{transition:color .2s ease,border-color .2s ease}
.mov .text-link:hover{color:var(--orange);border-color:var(--orange)}