/* ════════════════════════════════════════
   SPLASH SCREEN — splash.css
   ════════════════════════════════════════ */

#splash {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: #131111;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: opacity .65s ease, visibility .65s ease;
}

#splash.hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* ── LOGO ── */
.s-logo {
  width: 200px;
  height: 200px;
  object-fit: contain;
  opacity: 0;
  animation: fadeInUp 1s ease-out .3s forwards;
}

/* ── TITRE ── */
.s-title {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: clamp(1.4rem, 5vw, 2rem);
  color: #ffffff;
  letter-spacing: .05em;
  text-align: center;
  margin-top: 22px;
  opacity: 0;
  animation: fadeInUp 1s ease-out .6s forwards;
}

/* ── TRAIT ── */
.s-divider {
  width: 36px;
  height: 1px;
  background: rgba(255, 255, 255, .3);
  margin: 16px auto 0;
  opacity: 0;
  animation: fadeInUp 1s ease-out .8s forwards;
}

/* ── SOUS-TITRE ── */
.s-sub {
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  font-size: .72rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .48);
  margin-top: 12px;
  opacity: 0;
  animation: fadeInUp 1s ease-out 1s forwards;
}

/* ── BARRE DE CHARGEMENT ── */
.s-bar-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: rgba(255, 255, 255, .07);
}

.s-bar {
  height: 100%;
  width: 0%;
  background: rgba(255, 255, 255, .55);
  animation: splashLoad 2.8s cubic-bezier(.4, 0, .2, 1) .4s forwards;
}

/* ── ANIMATIONS ── */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes splashLoad {
  0%   { width: 0%; }
  60%  { width: 70%; }
  85%  { width: 90%; }
  100% { width: 100%; }
}