/* =============================================
   NovaWebDesign — trecerea între pagini
   1) View Transitions între documente (Chrome / Edge 126+, Safari 18.2+): un fade scurt, fără deplasare
      (bara de jos și meniul fix de pe telefon nu „alunecă”; navigarea nu așteaptă animația).
      Opt-in-ul (@view-transition) stă INLINE în <head> pe fiecare pagină, ca primul lucru după <meta charset>:
      într-un fișier CSS extern, Chrome îl vedea prea târziu (după scripturile blocante) și renunța la tranziție.
   2) Rezerva JS (js/nova-nav.js) pentru restul browserelor: html.nv-leaving (estompare ≤ 180 ms) și
      html.nv-arrive (fade-in scurt pe pagina nouă).
   3) prefers-reduced-motion: reduce → fără tranziție (navigare instant).
   Doar opacity; nicio animație nu ține o pagină invizibilă (fill „both” se termină la opacity 1).
   ============================================= */

@media (prefers-reduced-motion: no-preference) {
  @view-transition {
    navigation: auto;
  }

  /* fundal închis sub instantanee: fără flash deschis la margini în timpul tranziției */
  ::view-transition {
    background-color: var(--nv-bg, #0f1412);
  }

  ::view-transition-old(root) {
    animation: nova-vt-out 170ms cubic-bezier(0.4, 0, 1, 1) both;
  }

  ::view-transition-new(root) {
    animation: nova-vt-in 260ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }

  /* antetul rămâne pe loc: nu se estompează odată cu pagina (apare imediat cel nou, în aceeași poziție) */
  .navbar {
    view-transition-name: nova-nav;
  }
  ::view-transition-group(nova-nav) {
    animation-duration: 0s;
  }
  ::view-transition-old(nova-nav) {
    display: none;
  }
  ::view-transition-new(nova-nav) {
    animation: none;
  }

  /* rezerva JS */
  html.nv-leaving body {
    opacity: 0;
    transition: opacity 0.17s cubic-bezier(0.4, 0, 1, 1);
  }
  html.nv-arrive body {
    animation: nova-arrive 0.26s cubic-bezier(0.16, 1, 0.3, 1) both;
  }
}

@keyframes nova-vt-out {
  from { opacity: 1; }
  to   { opacity: 0; }
}

@keyframes nova-vt-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes nova-arrive {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: none;
  }

  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation: none !important;
  }

  html.nv-leaving body,
  html.nv-arrive body {
    opacity: 1 !important;
    animation: none !important;
    transition: none !important;
  }
}