/* L'habillage WILD du splash. La mécanique (fréquence, sorties, clavier,
   défilement, mouvement réduit) est celle de la brique session-splash, dans
   splash.css, copiée sans y toucher : ici ne vit que l'apparence. */
.splash-non .splash{display:none}

.splash{background:var(--vert-fonce);color:var(--creme);gap:0;overflow:hidden}
.splash-fond{
  position:absolute;inset:0;background:var(--vert-fonce) center/cover no-repeat;
  filter:saturate(1.05) brightness(.55);transform-origin:50% 60%;z-index:0;
}
/* Le voile : un halo sombre au centre pour que le texte tienne, les bords
   restent vivants. */
.splash::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:
    radial-gradient(ellipse at 50% 46%,rgba(12,46,49,.78) 0%,rgba(12,46,49,.5) 50%,rgba(12,46,49,.72) 100%),
    linear-gradient(180deg,rgba(12,46,49,.5),transparent 30%,transparent 70%,rgba(12,46,49,.6));
}
.splash-mark{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:0;max-width:min(34rem,88vw)}
.splash-logo{width:clamp(170px,30vw,300px);height:auto;display:block;filter:drop-shadow(0 4px 22px rgba(0,0,0,.4))}
.splash-regle{display:block;width:64px;height:3px;border-radius:2px;background:var(--or-clair);margin:26px 0 22px}
.splash-phrase{
  margin:0 0 30px;font-family:var(--serif);font-weight:600;line-height:1.25;letter-spacing:.01em;
  font-size:clamp(1.45rem,3.6vw,2.5rem);text-wrap:balance;text-shadow:0 2px 18px rgba(0,0,0,.4);
}
.splash-phrase:empty,.splash-entrer:empty{display:none}
.splash-entrer{min-width:11rem;justify-content:center;font-size:1.02rem;padding:14px 34px}
.splash-skip{z-index:2;color:var(--creme);opacity:.7;letter-spacing:.06em}
.splash-skip:empty{display:none}
.splash-close{
  position:absolute;top:16px;right:16px;z-index:3;width:42px;height:42px;border-radius:50%;
  border:1.5px solid rgba(255,245,233,.5);background:rgba(12,46,49,.4);color:var(--creme);
  font-size:1.5rem;line-height:1;cursor:pointer;backdrop-filter:blur(4px);
}
.splash-close:hover,.splash-close:focus-visible{background:rgba(255,245,233,.18);border-color:var(--creme)}
/* La barre dit que l'écran va se lever seul : sans elle, il disparaît sans
   prévenir sous les yeux de qui lit lentement. */
.splash-progres{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--or-clair);transform-origin:0 50%;z-index:2}
.splash-progres[hidden]{display:none}

/* Tout ce qui est fabriqué : cacher les deux boutons de la démo tant que le
   rideau est là, ils passeraient par-dessus. */
body.splash-lock .outils-demo{display:none}

@media (prefers-reduced-motion:no-preference){
  .splash-fond{animation:splash-zoom 16s ease-out both}
  .splash-logo{animation:splash-monte .9s cubic-bezier(.2,.7,.2,1) both}
  .splash-regle{animation:splash-trait .6s .55s cubic-bezier(.2,.7,.2,1) both}
  .splash-phrase{animation:splash-monte .9s .75s cubic-bezier(.2,.7,.2,1) both}
  .splash-entrer{animation:splash-monte .8s 1.2s cubic-bezier(.2,.7,.2,1) both}
  .splash-skip,.splash-close{animation:splash-apparait .8s 1.6s both}
  .splash-progres{animation:splash-progres var(--splash-duree,7s) linear both}
}
@keyframes splash-zoom{from{transform:scale(1.02)}to{transform:scale(1.16)}}
@keyframes splash-monte{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes splash-trait{from{width:0;opacity:0}to{width:64px;opacity:1}}
@keyframes splash-apparait{from{opacity:0}to{opacity:.7}}
@keyframes splash-progres{from{transform:scaleX(0)}to{transform:scaleX(1)}}
