/* ==========================================================
   transition.css : rideau de transition entre les pages
   (5 volets qui se lèvent à l'arrivée et retombent au départ)
   ========================================================== */
#ptx{position:fixed;inset:0;z-index:300;pointer-events:none;display:grid;grid-template-columns:repeat(5,1fr);overflow:hidden}
#ptx i{display:block;background:#0e0f10;border-bottom:3px solid #FB5607;transform-origin:top;
  animation:ptIn 1s cubic-bezier(.76,0,.24,1) both;animation-delay:calc(var(--n,0)*.065s)}
#ptx i:nth-child(1){--n:0}#ptx i:nth-child(2){--n:1}#ptx i:nth-child(3){--n:2}#ptx i:nth-child(4){--n:3}#ptx i:nth-child(5){--n:4}
#ptx i:nth-child(even){border-bottom-color:#8338EC}
#ptx .ptl{position:absolute;inset:0;display:grid;place-items:center;z-index:2;animation:ptLo .6s .2s ease both}
#ptx .ptl img{width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 10px 40px rgba(131,56,236,.45))}
#ptx.go{pointer-events:all;cursor:progress}
#ptx.go i{animation:ptOut .8s cubic-bezier(.76,0,.24,1) both;animation-delay:calc(var(--n,0)*.05s)}
#ptx.go .ptl{animation:ptLi .5s .3s cubic-bezier(.16,1,.3,1) both}
@keyframes ptIn{from{transform:scaleY(1)}to{transform:scaleY(0)}}
@keyframes ptOut{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes ptLo{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}
@keyframes ptLi{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){#ptx{display:none}}
