/* Salwane, splash d'entrée. Digne et sobre. Anti-FOUC: visible immédiatement. */

#salwane-splash{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:22px;
  background:linear-gradient(160deg,#16302B 0%,#1B3A34 45%,#2F5D52 100%);
  opacity:1;
  transition:opacity .6s ease;
  cursor:pointer;
  -webkit-font-smoothing:antialiased;
}

/* État de sortie: fondu */
#salwane-splash.is-leaving{opacity:0}

/* Pastille logo, reprend l'esprit breathe/ripple du logo du site */
#salwane-splash .sp-mark{
  position:relative;
  width:72px;
  height:72px;
  border-radius:50%;
  background:linear-gradient(145deg,#1B3A34,#6B8A7F);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#FAF6EE;
  font-family:'Fraunces',serif;
  font-size:34px;
  flex-shrink:0;
  opacity:0;
  transform:scale(.85);
  animation:sp-mark-in .6s cubic-bezier(.2,.7,.2,1) forwards, salwane-breathe 4.6s ease-in-out infinite .6s;
}
#salwane-splash .sp-mark::before,
#salwane-splash .sp-mark::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  border:1.5px solid #C9A86A;
  opacity:0;
  pointer-events:none;
}
#salwane-splash .sp-mark::before{animation:salwane-ripple 3.8s ease-out infinite .8s}
#salwane-splash .sp-mark::after{animation:salwane-ripple 3.8s ease-out infinite 2.7s}

/* Mot Salwane */
#salwane-splash .sp-word{
  font-family:'Fraunces',serif;
  font-weight:500;
  letter-spacing:-.01em;
  color:#FAF6EE;
  font-size:clamp(34px,6vw,52px);
  line-height:1.1;
  opacity:0;
  transform:translateY(10px);
  animation:sp-rise .5s ease forwards .5s;
}

/* Slogan */
#salwane-splash .sp-slogan{
  font-family:'Inter',sans-serif;
  font-weight:500;
  color:#C9A86A;
  font-size:clamp(15px,2.6vw,20px);
  letter-spacing:.04em;
  text-align:center;
  max-width:88vw;
  padding:0 16px;
  opacity:0;
  transform:translateY(10px);
  animation:sp-rise .5s ease forwards .68s;
}
#salwane-splash .sp-slogan[dir="rtl"]{
  font-family:'Inter',sans-serif;
  letter-spacing:0;
}

@keyframes sp-mark-in{
  from{opacity:0;transform:scale(.85)}
  to{opacity:1;transform:scale(1)}
}
@keyframes sp-rise{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

/* Réutilise les keyframes du logo du site (breathe + ripple) si anim.css absent,
   on les redéclare ici pour que le splash soit autonome. */
@keyframes salwane-breathe{
  0%,100%{box-shadow:0 0 0 0 rgba(184,146,90,0)}
  50%{box-shadow:0 0 16px 1px rgba(184,146,90,.40)}
}
@keyframes salwane-ripple{
  0%{transform:scale(1);opacity:.55}
  70%{opacity:.12}
  100%{transform:scale(2.2);opacity:0}
}

/* Accessibilité: mouvement réduit. Pas de scale/ripple, fondu simple et court. */
@media (prefers-reduced-motion: reduce){
  #salwane-splash{transition:opacity .35s ease}
  #salwane-splash .sp-mark{
    animation:none;
    opacity:1;
    transform:none;
  }
  #salwane-splash .sp-mark::before,
  #salwane-splash .sp-mark::after{animation:none;opacity:0}
  #salwane-splash .sp-word,
  #salwane-splash .sp-slogan{
    animation:none;
    opacity:1;
    transform:none;
  }
}
