/* ===== TRANSIZIONI TRA PAGINE ===== */
/* Disattiva il vecchio effetto (buio + sfocato su tutta la pagina) */
body.fade-out{opacity:1 !important;filter:none !important}
body{transition:none !important}

/* Browser moderni (Safari 18.2+, Chrome): transizione nativa tra pagine */
@view-transition{navigation:auto}
.hero-nav{view-transition-name:menu}
#matrix{view-transition-name:matrix}
::view-transition-old(root){animation:ptOut .28s cubic-bezier(.4,0,1,1) both}
::view-transition-new(root){animation:ptIn .5s cubic-bezier(.2,.8,.2,1) .06s both}
::view-transition-group(menu),::view-transition-group(matrix){animation-duration:.35s}

/* Animazione di uscita e di entrata del contenuto */
@keyframes ptOut{to{opacity:0;transform:translateY(-14px) scale(.985);filter:blur(6px)}}
@keyframes ptIn{from{opacity:0;transform:translateY(18px) scale(.99);filter:blur(6px)}}

/* Fallback (file locali o browser vecchi): animiamo il contenuto, non il menu né lo sfondo */
html:not(.vt) .pt-c{animation:ptIn .55s cubic-bezier(.2,.8,.2,1) backwards}
html.pt-leave .pt-c{animation:ptOut .26s cubic-bezier(.4,0,1,1) both}
html.pt-leave #matrix{transition:opacity .26s;opacity:.4}

@media (prefers-reduced-motion: reduce){
  ::view-transition-old(root),::view-transition-new(root),.pt-c,html.pt-leave .pt-c{animation:none !important}
}