/* Transition de page Via Expedito : balayage bleu nuit puis terracotta, de droite à gauche */
.ve-pt{position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999;pointer-events:none;overflow:hidden;visibility:hidden}
html.ve-js .ve-pt{visibility:visible}
.ve-pt i{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;transform:translateX(0)}
.ve-pt i:nth-child(1){background:#C2502B}
.ve-pt i:nth-child(2){background:#0F2A44}
.ve-pt svg{width:96px;height:64px}

/* Arrivée : la page est couverte, les volets partent vers la gauche */
html.ve-js.ve-in .ve-pt i{animation:ve-pt-out 1.5s cubic-bezier(.76,0,.24,1) forwards}
html.ve-js.ve-in .ve-pt i:nth-child(1){animation-delay:.6s}
html.ve-js.ve-in .ve-pt i:nth-child(2){animation-delay:.35s}
html.ve-js.ve-in .ve-pt svg{animation:ve-pt-logo .9s cubic-bezier(.2,.8,.2,1) both}
@keyframes ve-pt-out{from{transform:translateX(0)}to{transform:translateX(-101%);visibility:hidden}}
@keyframes ve-pt-logo{0%{opacity:0;transform:scale(.92)}45%,100%{opacity:1;transform:none}}

/* Départ : les volets arrivent par la droite et couvrent la page */
html.ve-js.ve-leave .ve-pt{pointer-events:all}
html.ve-js.ve-leave .ve-pt i{animation:ve-pt-cover .75s cubic-bezier(.76,0,.24,1) both}
html.ve-js.ve-leave .ve-pt i:nth-child(2){animation-delay:0s}
html.ve-js.ve-leave .ve-pt i:nth-child(1){animation-delay:.12s}
@keyframes ve-pt-cover{from{transform:translateX(101%)}to{transform:translateX(0)}}

/* Entrée du contenu */
html.ve-js.ve-in .ve-page > header{animation:ve-pt-rise .9s cubic-bezier(.2,.8,.2,1) 1.1s both}
html.ve-js.ve-in .ve-page > main{animation:ve-pt-rise 1s cubic-bezier(.2,.8,.2,1) 1.25s both}
@keyframes ve-pt-rise{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion: reduce){
  .ve-pt{display:none!important}
  html.ve-js.ve-in .ve-page > header,html.ve-js.ve-in .ve-page > main{animation:none}
}
