/* Transitions entre pages (decisions de Sirven du 2026-11-09).
   Chargee par toutes les pages qui participent : pages publiques, pages de
   connexion, espaces investisseur, fondateur et structure. C'est la SEULE
   feuille qui declare la transition de document (garde
   navigation-sans-flash.test.js) ; js/rideau.js, charge juste apres, decide
   pour chaque navigation :
   - entre deux pages publiques : la fenetre et le titre (css/ds/mouvement.css) ;
   - entre deux pages d'un meme espace : le fondu court (css/ds/mouvement-app.css) ;
   - quand on change de monde (site public, connexion, espaces, et d'un espace
     a l'autre) : le rideau, ci-dessous, porte par le type « rideau » ;
   - entre deux etapes de connexion, ou vers toute autre page : rien. */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
}

/* Le rideau est un vrai element (.mvt-rideau, dernier enfant de <body> de
   chaque page qui participe), pose juste sous la fenetre : la transition le
   capture des deux cotes, puis son groupe traverse l'ecran de bas en haut. Il
   couvre l'ancienne page, s'arrete pendant que la flamme se pose, puis se
   leve sur la nouvelle, deja rendue derriere. Nuit de la marque, halo et
   liseres a la couleur d'accent de la page d'arrivee. */
.mvt-rideau {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2147483000;
  width: 100%;
  height: 100vh;
  display: grid;
  place-items: center;
  translate: 0 100vh;
  background: radial-gradient(34% 30% at 50% 50%, color-mix(in srgb, var(--lp-accent, #7b2d8e) 42%, transparent), transparent 72%), #050609;
  border-block: 2px solid var(--lp-accent, #7b2d8e);
  box-sizing: border-box;
  pointer-events: none;
  contain: strict;
  view-transition-name: mvt-rideau;
}
.mvt-rideau__logo { width: 44px; height: 80px; view-transition-name: mvt-rideau-logo; }
@media print { .mvt-rideau { display: none; } }

/* Hors changement de monde, le rideau ne se montre jamais. */
::view-transition-group(mvt-rideau),
::view-transition-group(mvt-rideau-logo) { display: none; }

:root:active-view-transition-type(rideau)::view-transition-group(mvt-rideau) { display: block; animation: mvt-rideau-course 860ms both; }
/* Le groupe est place par une transformation du navigateur : il ne recoit
   que `translate` (applique en dernier). L'agrandissement va sur l'image. */
:root:active-view-transition-type(rideau)::view-transition-group(mvt-rideau-logo) { display: block; animation: mvt-rideau-course 860ms both; }
/* Une seule image du rideau : jamais de double exposition entre les deux pages. */
:root:active-view-transition-type(rideau)::view-transition-old(mvt-rideau),
:root:active-view-transition-type(rideau)::view-transition-old(mvt-rideau-logo) { display: none; }
:root:active-view-transition-type(rideau)::view-transition-new(mvt-rideau) { animation: none; }
:root:active-view-transition-type(rideau)::view-transition-new(mvt-rideau-logo) { animation: mvt-rideau-logo 860ms both; }
:root:active-view-transition-type(rideau)::view-transition-old(root) { animation: mvt-rideau-ancienne 860ms both; }
:root:active-view-transition-type(rideau)::view-transition-new(root) { animation: mvt-rideau-nouvelle 860ms both; }
:root:active-view-transition-type(rideau)::view-transition-group(mvt-logo),
:root:active-view-transition-type(rideau)::view-transition-group(mvt-cookies) { animation-duration: 860ms; }
/* Un titre nomme par une page precedente ne traverse jamais le rideau. */
:root:active-view-transition-type(rideau)::view-transition-group(mvt-titre) { display: none; }

/* Monte et couvre (0-42 %), tient (42-58 %), se leve (58-100 %). */
@keyframes mvt-rideau-course {
  0% { translate: 0 0; animation-timing-function: cubic-bezier(0.7, 0, 0.25, 1); }
  42% { translate: 0 -100vh; }
  58% { translate: 0 -100vh; animation-timing-function: cubic-bezier(0.7, 0, 0.25, 1); }
  100% { translate: 0 -200vh; }
}
@keyframes mvt-rideau-logo {
  0%, 20% { scale: 0.5; rotate: -14deg; opacity: 0; animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); }
  50%, 100% { scale: 1; rotate: 0deg; opacity: 1; }
}
@keyframes mvt-rideau-ancienne {
  0% { opacity: 1; translate: 0 0; animation-timing-function: cubic-bezier(0.7, 0, 0.25, 1); }
  42% { opacity: 1; translate: 0 -8vh; }
  42.01%, 100% { opacity: 0; }
}
@keyframes mvt-rideau-nouvelle {
  0%, 57.99% { opacity: 0; }
  58% { opacity: 1; translate: 0 10vh; animation-timing-function: cubic-bezier(0.7, 0, 0.25, 1); }
  100% { opacity: 1; translate: 0 0; }
}