/* Transitions entre les pages du site (accueil, règlement, mentions légales) */

/* Navigateurs récents (Chrome, Edge, Safari) : transition native entre deux pages */
@view-transition { navigation: auto; }

::view-transition-old(root){
  animation:vt-out .38s cubic-bezier(.4,0,.2,1) both;
}
::view-transition-new(root){
  animation:vt-in .6s cubic-bezier(.2,.7,.2,1) .12s both;
}
@keyframes vt-out{
  to{ opacity:0; transform:scale(.97) translateY(-12px); filter:blur(8px); }
}
@keyframes vt-in{
  from{ opacity:0; transform:scale(1.02) translateY(20px); filter:blur(8px); }
}

/* entre les deux pages, une lueur dorée remonte doucement derrière le contenu */
::view-transition{
  background:
    radial-gradient(ellipse 70% 40% at 50% var(--vt-glow-y, 60%), rgba(var(--accent-rgb),0.28), transparent 70%),
    var(--bg);
  animation:vt-glow .8s cubic-bezier(.4,0,.2,1) both;
}
@property --vt-glow-y{ syntax:'<percentage>'; inherits:false; initial-value:60%; }
@keyframes vt-glow{
  from{ --vt-glow-y:85%; }
  to{ --vt-glow-y:20%; }
}

/* le logo glisse d'une page à l'autre */
.vt-logo{ view-transition-name:logo; }
::view-transition-group(logo){
  animation-duration:.7s;
  animation-timing-function:cubic-bezier(.2,.7,.2,1);
}
/* il disparaît puis réapparaît comme le reste de la page, sinon il resterait figé
   entre deux pages où il est au même endroit (règlement, vote…) */
::view-transition-old(logo){
  animation:vt-logo-out .38s cubic-bezier(.4,0,.2,1) both;
}
::view-transition-new(logo){
  animation:vt-logo-in .6s cubic-bezier(.2,.7,.2,1) .12s both;
}
@keyframes vt-logo-out{ to{ opacity:0; filter:blur(8px); } }
@keyframes vt-logo-in{ from{ opacity:0; filter:blur(8px); } }

/* Autres navigateurs (Firefox) : fondu géré par transitions.js */
html.vt-leaving body{
  opacity:0; transform:translateY(-10px); filter:blur(6px);
  transition:opacity .3s ease, transform .3s ease, filter .3s ease;
}

@media (prefers-reduced-motion:reduce){
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*){ animation:none !important; }
  html.vt-leaving body{ transition:none; }
}